1

以下のスクリプトを変更して、少数のテキスト DIV をスライドショー/回転させようとしています。

これらの DIV を順番に表示する必要があります: div 1、次に div 2、次に div 3。それぞれが 5 秒間表示され、次の div が表示されますが、順番に表示されます。

以下のスクリプトはランダムな div ではうまく機能しますが、毎回 div 1、div 2、div 3... という順序で配置する必要があります。

コード:

<div id="d1" style="display:none;">some text 1</div>
<div id="d2" style="display:none;">some text 2</div>
<div id="d3" style="display:none;">some text 3</div>

<script type="text/javascript">
divs = ['d1','d2','d3'];

function hideDivs() {
    for (var i=0; i<divs.length; i++)
    document.getElementById(divs[i]).style.display = 'none';
}

function showDiv() {
    hideDivs(); //hide them all before we show the next one.
    var randomDiv = divs[Math.floor(Math.random()*divs.length)];
    var div = document.getElementById(randomDiv).style.display = 'block';
    setTimeout(showDiv,500); //set a delay before showing the next div
}

showDiv();
</script>

3 つのテキストベースの DIV タグを順番にローテーションしようとしています。

  • Div 1 が 5 秒間表示されます...
  • その後、Div 2 が 5 秒間表示されます...
  • その後、Div 3 が 5 秒間表示されます...

私が投稿したスクリプトは、これらの DIV タグをランダムにローテーションします。スクリプトは機能しますが、必要なことを実行できるように微調整する必要があります。

div 1、div 2、div 3 をランダムにではなく、この順序で表示するスクリプトが必要です。

その方法がわかりません。

4

0 に答える 0