1

私は、li が img を持っているリストを持っています。画像はサムネイルであり、親指の大きなバージョンを反復処理する必要がある別の div があります。また、ユーザーがサムネイルの上を移動すると、大きな画像の繰り返しが停止し、ホバーされたものを表示する必要があります。

私のホバーは機能していますが、反復とタイミングは機能していません。これは noob 静的ページの私の能力の限界を実際に押し上げているので、私は何かが欠けていますが、驚くことではありません!

シンプルなhtml:

<ul>
 <li><img src='blah' />text</li>
 <li><img src='blah' />text</li>
</ul>
<div ='big'></div>

jquery:

$(document).ready(function(){

    $('li img').each(function (i) {
        var thumb = $(this).attr("src");
        setTimeout(function () { 
            $('#big').html('<img src=' + thumb + '/>');

            }, 5000 * (i + 1));
    });

    imgHov();

});

function imgHov(){
    $('li img').hover(
        function(){
            $('#big').html('<img src=' + $(this).attr("src") + '/>');
        },
        function(){
            $('#big').html("");
        }
        );

};

私はこれを完全に再構築する準備ができています。jquery .map() とリストを .each の代わりに配列に変換する他の方法を使用してみました。あなたの専門家がこれで行く方向を教えてください。ありがとう！

4

1 に答える 1

3

私はあなたのためにこれを作りました、見てください...

ライブデモ:

http://jsfiddle.net/oscarj24/XcZBq/

を使用する代わりにsetTimeout、 を使用setIntervalしてこれにいくつかのロジックを追加しただけです。

お役に立てれば。

于 2012-10-20T05:56:48.003 に答える