javascript - イメージ スライダー タイマーのイベントをクリックします。

Question

私はタイマーを使って画像スライダーに取り組んでいます。しかし、いくつかの問題があります...

1. 画像がテキストと同期していない
2. サムネイルタイマーのクリックイベントが必要です。クリックすると、画像が明確な間隔で変化するはずです。

これが私が試しているリンクです：

http://jsfiddle.net/alex_ball/UgQJG/

Answer 1

シンクロに気づきました。問題は、画像を表示する完全なループの後に解決されるため、画像のダウンロード速度に関連しています。スライド ショーで 1.jpg、2.jpg、3.jpg、4.jpg を使用するとします。そのため、使用した div パネルの前に表示された none div に最初に含めます。

    <div style="display:none">
    <img src='1.jpg' />
    <img src='2.jpg' />
    <img src='3.jpg' />
    <img src='4.jpg' />
    </div>

    <div id="panel">
      <div id="title">
      </div>
      <img id="imageSlide" alt="" src="" width="250px"/>
      <div id="desc">
      </div>
    </div>
<script>
//JavaScript slide initiation code here.
</script>

これにより、ページはスライド ショーをレンダリングする前に画像をダウンロードできるようになるため、画像はテキストと同じ速度で維持されるようになります。