Question

我想修改我的幻灯片，以包含幻灯片中图片的链接。我的原始代码是，它的工作原理：

VAR slides=new Array("s1.jpg","s2.jpg")
var slideCntr=slides.length-1
function slideShow() {
   slideCntr+=1
   if (slideCntr==slides.length) slideCntr=0
   document.getElementById("slideHolder").src = slides[slideCntr]
   setTimeout("slideShow()",3000)
}

在我的代码中，我有5个图像链接，显示为无。我正在使用一个填充了图像标记的id的数组，并将显示更改为阻止。我想我需要一些东西来改变显示器。不确定，但我现在有什么不起作用，请帮忙。我需要帮助的新代码是：

var slides=new Array("slide1","slide2","slide3","slide4","slide5")
var slideCntr=slides.length-1
function slideShow(){
    slideCntr+=1
    if (slideCntrl==slides.length) 
    slideCntr=0
    document.getElementById(slideCntr).style="display: block;"
    setTimeout("slideShow()",3000)}
    <body onLoad="slideShow()">
    <div>
    <a href="#"><img id="slide1" src="s1.jpg"></a>
    <a href="#"><img id="slide2" src="s2.jpg"></a>
    <a href="#"><img id="slide3" src="s3.jpg"></a>
    <a href="#"><img id="slide4" src="s4.jpg"></a>
    <a href="#"><img id="slide5" src="s5.jpg"></a>
    </div>
    </body>

Answer 1

此代码完美无缺。

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<style type="text/css">
    img
    {
        display:none;   
    }
</style>


</head>

<body>
    <div>
        <a href="#"><img id="slide1" src="1.png"></a>
        <a href="#"><img id="slide2" src="2.png"></a>
        <a href="#"><img id="slide3" src="3.png"></a>
        <a href="#"><img id="slide4" src="4.png"></a>
        <a href="#"><img id="slide5" src="5.png"></a>
    </div>
    <script type="text/javascript">
        var slides=new Array("slide1","slide2","slide3","slide4","slide5");
        var slideCntr = 1;
        setInterval(slideShow,3000);

        function slideShow()
        {
            //alert('called');
            for(var i = 1 ; i < slides.length+1 ; i++)
            {
                document.getElementById("slide"+i).style.display =  "none"; 
            }
            document.getElementById("slide"+slideCntr).style.display =  "block";
            slideCntr+=1;
            if(slideCntr == slides.length+1) 
            {
                slideCntr = 1;
            }

        }
    </script>
</body>
</html>

添加指向幻灯片的链接

1 个答案: