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を使用することをお勧めします。これにより、ドキュメントがロードされた直後にスクリプトを実行できるようになります。

<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 に答える