1

スライダーに表示されるhtmlのセクションにforループを介して画像を挿入しています。これをブラウザに表示しようとしていますが、開発者ツールが奇妙なエラーをスローし続けます。どこかに文字を挿入していると思いますが、jqueryライブラリはそれを好みません。

キャッチされないエラー:構文エラー、認識されない式:[オブジェクトオブジェクト]:eq(0)

これが私のコードです。

var theImgHTML = "<div class='slides_container portfolio-img'>";

for (i = 0; i < imgList.length; i++) {
    theImgHTML += "<img src='images/portfolio/" + imgList[i] + "' alt='Slide " + (i + 1) + "' />";
}

theImgHTML += "</div>";

$("#slides").html(theImgHTML);

$("#slides").slides({
    preload: true,
    preloadImage: 'img/loading.gif',
    play: 5000,
    pause: 2500,
    hoverPause: true
});​

これがhtmlの結果として出てくるものです。

<div class="slides_container portfolio-img" style="overflow: hidden; position: relative; display: block; background-image: url(loading.gif); background-position: 50% 50%; background-repeat: no-repeat no-repeat;">
    <div class="slides_control" style="position: relative; width: 0px; height: 0px; left: 0px;">
        <img src="images/portfolio/one.jpg?1354641162837" alt="Slide 1" style="position: absolute; top: 0px; left: 0px; z-index: 0; display: none;">
        <img src="images/portfolio/two.jpg" alt="Slide 2" style="position: absolute; top: 0px; left: 0px; z-index: 0; display: none;">
        <img src="images/portfolio/three.jpg" alt="Slide 3" style="position: absolute; top: 0px; left: 0px; z-index: 0; display: none;">
    </div>
</div>

考え?

4

1 に答える 1

0

問題は、変数「theImgHTML」(画像のマークアップを含む)をスライドに追加するときに、各画像をdivで囲む必要があることでした。私はそれをしていませんでした。スライドプラグインによると、表示する画像がある場合、各divは各画像を囲むdivを持っている必要があります。

私はdivなしでそれを試しましたが、画像を自分で持っていたのですが、プラグインはそれを受け入れませんでした(したがって上記のエラー)。うまくいけば、これは将来誰かを助けるでしょう。

これが機能する例です。

<div id="slides">
     <div class="slides_container">
          <div>
             <img src="http://placehold.it/570x270">
          </div>
          <div>
             <img src="http://placehold.it/570x270">
          </div>
      </div>
</div>

詳細については、以下のリンクにアクセスし、基本的なマークアップにアクセスしてください。

http://www.slidesjs.com/

于 2012-12-05T17:17:12.130 に答える