0

jQuery スクリプトが最初の読み込み (ナビゲーション リンクのクリック) で正しく読み込まれる原因を理解するのに苦労していますが、ブラウザで「更新」を押すと失敗します。

これは、流動的なレイアウト内でフルサイズで中央に配置された一連の画像を循環する単純なスクリプトです。ロード時に、スクリプトは画像が画面の中央に配置されるように、適切な左マージンを設定する必要があります。ナビゲーションのリンクをクリックすると、うまくいくようです。ページを更新すると、スクリプトが失敗し、画像の余白が 2 倍になり、写真が画面の端にオフセットされます。

スライドショーはこちらで実際に見ることができます。ページを更新してから、ナビゲーションの青い「ティブロン レジデンス」リンクをクリックすると、エラーを再現できるはずです。(スクリーンショット: http://imgur.com/a/z2hki )

http://dev.christinerode.com/garyhutton/tiburon.html

スクリプトと CSS インクルード、および関数の順序を変更しようとしましたが、うまくいきません。これが特定の更新でのみ発生するのはなぜですか?

jquery.cycle プラグインを使用していますが、これが他に見られません。同じコードの異なる表示をトリガーする JavaScript で何が起こっていますか?

4

1 に答える 1

0

いくつかの提案：

すべてのスクリプトを</body>タグの前に配置します。このようにして、DOM要素のサイズ測定が行われる前にドキュメントがロードされていることを確認します。

  <script> // jquery // </script>
  <script> // cycle.plugin </script>
  <script> // your jQ functions // </script>

</body>

ifギャラリーのアニメーション中にクリックを防ぐためにスライドがアニメーション化されているかどうかを確認するステートメントを追加するよりも、次のようになります。

$("#slide_prev").click(function(){
   if( !($('.slideshow img').is(':animated') ) ){
      $('.slideshow').cycle("previous");
   }
});
$("#slide_next").click(function(){
   if( !($('.slideshow img').is(':animated') ) ){
      $('.slideshow').cycle("next");
   }
});

それはあなたの質問に対する私のコメントの問題を防ぐでしょう。

それでもエラーが発生する場合（私はお勧めしませんが、試すことができます）：

$(window).load(function(){
    // your functions
});
于 2012-05-13T22:58:01.793 に答える