-1

ここに私のサイトがあります：

violetoeuvre.com

スクロールするとホーム画像が変わるようにプログラムしたいと思います。

これが私のJavaScriptです：

<!-- Photo __________________________________________-->

    <div id="home_photo">

        <img id="home_photo" src="images/photo/1.jpg" />
                <script type="text/javascript">
                var myimages=[
                "images/photo/1.jpg",
                "images/photo/2.jpg",
                "images/photo/3.jpg",
                "images/photo/4.jpg",
                "images/photo/5.jpg",
                "images/photo/6.jpg",
                "images/photo/7.jpg",
                "images/photo/8.jpg",
                "images/photo/9.jpg",
                "images/photo/10.jpg",
                "images/photo/12.jpg",
                "images/photo/13.jpg",
                "images/photo/14.jpg",
                "images/photo/15.jpg",
                "images/photo/16.jpg",
                "images/photo/18.jpg",
                "images/photo/19.jpg",
                "images/photo/20.jpg",
                "images/photo/21.jpg",
                "images/photo/22.jpg",
                "images/photo/23.jpg",
                ]
                var slideshow=document.getElementById("slideshow")
                var nextslideindex=0
                function rotateimage(e){
                var evt=window.event || e
                var delta=evt.detail? evt.detail*(-120) : evt.wheelDelta
                nextslideindex=(delta<=-120)? nextslideindex+1 : nextslideindex-1
                nextslideindex=(nextslideindex<0)? myimages.length-1 : (nextslideindex>myimages.length-1)? 0 : nextslideindex
                slideshow.src=myimages[nextslideindex]
                if (evt.preventDefault)
                evt.preventDefault()
                else
                return false
                }
                var mousewheelevt=(/Firefox/i.test(navigator.userAgent))? "DOMMouseScroll" : "mousewheel"

                if (slideshow.attachEvent)
                slideshow.attachEvent("on"+mousewheelevt, rotateimage)
                else if (slideshow.addEventListener)
                slideshow.addEventListener(mousewheelevt, rotateimage, false)
                </script>
    </div>

ご覧のとおり、スクロールすると変化する 23 枚の画像があります。何が問題なのかわかりません。

私のdivの何かが台無しになっているのでしょうか？それとも id 要素を悪用していますか?

ありがとうございました！

4

1 に答える 1

0

まず第一に、スライドショー変数を存在しない要素に設定しています。「スライドショー」要素はどこにありますか? Jan の言う通り、ID は一意でなければなりません。

FireFox 用の Firebug をまだ入手していない場合は入手することをお勧めします。これは JavaScript のデバッグに非常に役立ちます。

于 2013-03-28T17:39:30.067 に答える