这是我的网站:
紫罗兰色.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 元素?
谢谢!