1

このバックグラウンド フェーダーを修正しようとしています。動作しますが、一部の値が未定義として返され、それを理解できません。どんな助けも大歓迎です。

PHP はディレクトリを読み取り、画像のファイルパスを取得してから、そのテキストを含む隠しスパンを作成します。

       $(document).ready(function () {
         /* DocReady */
         var counter = 0;
         var faderImgs = new Array();
         $('span.entry').each(function () {
           var value = 'images/bg/' + $(this).text();
           faderImgs.push(value);
           $('<img />').attr('src', value).appendTo(this).css('display', 'none');
         })

         /* DocReady */

         var intId = setInterval(faderBg, 8000);
         var numItems = $('span.entry').length;

         function faderBg() {

           $('.background-fader').animate({
             'opacity': '0'
           }, 2000, function () {
             $('.background-fader').css('background-image', 'url(' + faderImgs[counter] + ')')
             $('.background-fader').animate({
               'opacity': '1'
             }, 2000)

           })
           counter++;
           if (counter > numItems) {
             var counter = 0;
           }
         }

       });

- - - - - - - - - - - - - - 編集 - - - - - - - - - - - ------------------

助けてくれてありがとう、すべてが再び働いています。

4

1 に答える 1

2

カウンターが配列の最後からこぼれています。それが大きいときではなく、「numItems」に等しいときにゼロに戻す必要があります。JavaScript 配列はゼロから始まるため、最大のインデックスはnumItems - 1.

       counter++;
       if (counter >= numItems) { // >=, not >
         counter = 0;
       }

varまた、 「カウンター」をゼロに戻す場合は必要ありません。作成する要素の「src」属性を設定する.prop()代わりに使用する必要があります。(ブラウザのキャッシュに画像をプリフェッチするためでない限り、わざわざそれらを作成する理由がわかりません。そうであれば、要素を DOMに追加する必要はありません。インスタンスを作成し、その " src" プロパティ).attr()<img><img>Image

編集— @charlietfl は、その内部関数にローカルの「カウンター」変数varが存在することになるため、その迷走が深刻な問題を引き起こすことを正しく指摘しています。実際、実際のコードにそれがあった場合、「カウンター」は常に（またはポストインクリメントの後に）あるため、それがどのように機能するかまったく想像できません。undefinedNaN

于 2012-10-14T13:26:49.933 に答える