1

我正在尝试在没有 Flash 的情况下制作一些动画，我需要加载一个徽标，然后在完全停止之前摇动

我需要它在加载时发生（抖动是客户端请求）。

现在，当您单击它时，它可以工作，但我需要它自动运行。

这是我的 JavaScript 代码：

$(window).load(function() {
  jQuery.fn.shake = function() {
    this.each(function(i) {
      $(this).css({"position": "absolute"});
      for(var x = 1; x <= 3; x++) {
        $(this).animate({left: 43}, 10)
          .animate({left: 23}, 50)
          .animate({left: 23}, 10)
          .animate({left: 13}, 50)
          .animate({left: 43}, 50)
          .animate({left: 33}, 50)
          .animate({left: 43}, 50);
      }
    });
    return this;
  }

  $("#logo").click(function() {
    $(this).shake();
  });
});

#logo元素是包含图像的 div 。

任何帮助将不胜感激，谢谢。

4

5 回答 5

3 
<script type='text/javascript'>
    jQuery.fn.shake = function() {
        this.each(function(i) {
            $(this).css({
                "position": "absolute"
            });
            for (var x = 1; x <= 3; x++) {
                $(this).animate({
                    left: 43
                }, 10).animate({
                    left: 23
                }, 50).animate({
                    left: 23
                }, 10).animate({
                    left: 13
                }, 50).animate({
                    left: 43
                }, 50).animate({
                    left: 33
                }, 50).animate({
                    left: 43
                }, 50);
            }
        });
        return this;
    }
    $(document).ready(function() {
        $("#logo").shake();
    });
</script>​​​
于 2012-08-23T00:02:33.773 回答
1

如果您需要模拟点击，您可以将其添加到您的代码中：

$("#logo").click();

无论如何，我建议您使用 $(document).ready 而不是 window，因为它允许您在加载文档后让脚本执行。

<script type='text/javascript'>//<![CDATA[ $(document).ready(function(){ jQuery.fn.shake = function() { this.each(function(i) { $(this).css({ "position" : "absolute" }); for (var x = 1; x <= 3; x++) { $(this).animate({ left: 43 }, 10).animate({ left: 23 }, 50).animate({ left:23},10).animate({ left: 13 }, 50).animate({ left: 43 }, 50).animate({ left: 33 },50).animate({ left: 43 }, 50); } }); return this; } $("#logo").click(function() { $(this).shake(); }); });//]]> </script>
于 2012-08-23T00:00:38.580 回答
0

$("#logo").shake()在加载功能结束时不起作用？

而不是使用：

$("#logo").click(function() {
  $(this).shake();
});

利用：

$("#logo").shake();

您不必添加onclick事件侦听器并模拟点击，您可以直接触发该函数。

于 2012-08-22T23:59:28.943 回答
0

你实际上应该打电话$('#logo').shake();，但你也可以这样做$('#logo').trigger('click');

查看触发方法的文档。

于 2012-08-23T00:00:17.577 回答
0

如果您想在不单击 div 的情况下执行此操作，那么为什么要使用该单击处理程序。当页面像这样加载时，您可以这样做：

<script type='text/javascript'>//<![CDATA[ 
    $(window).load(function(){

        jQuery.fn.shake = function() {
            this.each(function(i) {
            $(this).css({ "position" : "absolute" });
            for (var x = 1; x <= 3; x++) {
            $(this).animate({ left: 43 }, 10).animate({ left: 23 }, 50).animate({ left:23},10).animate({ left: 13 }, 50).animate({ left: 43 }, 50).animate({ left: 33 },50).animate({ left: 43 }, 50);
                }
            });
            return this;
            }

        $(this).shake();
});//]]>  

</script>
于 2012-08-23T00:04:56.620 回答