0

そこで、スタートボタンを押してタイマーを開始する画像のスライドショーを作成しようとしています。すべてが正しくコーディングされていると思いますが、イメージが変わることはありません。何が問題なのかわかりません。

<!DOCTYPE html>
<html>
<head><title>Slide Show</title>
    <script type ="text/javascript">
        var i=0;
        var timeout;
        function preLoadImages()
        {
            if (document.images)
            {
                fire = new Array();
                fire[0] = new Image();
                fire[0] = "./images/fire2.jpg";
                fire[1] = new Image();
                fire[1] = "./images/fire3.jpg"
                fire[2] = new Image();
                fire[2] = "./images/fire4.jpg"
                fire[3] = new Image();
                fire[3] = "./images/fire1.jpg"
            }
            else
            {
                alert("There are no images to preload");
            }
        }
        function startSlideshow()
        {
            if (i < fire.length)
            {
                document.images["fire_pic"].src = fire[i];
                i++;
            }
            else
            {
                i = 0;
                document.images["fire_pic"].src = fire[i];
            }
            timeout = setTimeout('startSlideShow()',1000);
        }
        function stopSlideShow()
        {
            clearTimeout(timeout);
        }
    </script>
</head>
<body onload = "preLoadImages()">
    <img name="fire_pic" src="./images/fire1.jpg" height="289" width="432"/>
    <form>
        <br /><br />
        <input type=button value="Start Show" onClick="return startSlideShow();"/>
        <input type=button value="Stop Show" onClick="return stopSlideShow();"/>
    </form>
</body>

4

1 に答える 1

0

大文字と小文字が一致しないため、実行時エラーが発生startSlideshowしました: vs startSlideShow; 1 つを選択します。ブラウザー コンソールをチェックして、エラーを確認します。

また、プリローダー コードは機能しません。Imageオブジェクトを配列に追加し、すぐにそれらを文字列で上書きしています。以下を使用する必要があります。

fire = new Array();
fire[0] = new Image();
fire[0].src = "./images/fire2.jpg";

次にstartSlideShow(またはstartSlideshow) を使用する必要がありますdocument.images["fire_pic"].src = fire[i].src。

すべての修正を含むデモ。

于 2013-09-16T19:52:16.910 に答える