如何使此幻灯片放映不是自动的,而是单击以更改图像

How to make this Slideshow not automatic but click to change image

本文关键字:单击 图像 幻灯片 何使此      更新时间:2023-09-26

这段代码是一个自动幻灯片,我想让它在你点击下一个时转到下一个图像,然后返回到上一个图像

我当前的代码:

<head>
<script type="text/javascript">
var image1 = new Image()
image1.src = "http://www.adactushousing.co.uk/images/upload/coverImage/Local%20Offer%20CCH.jpg"
var image2 = new Image()
image2.src = "http://www.northantspfg.co.uk/resources/uploads/news/wordal13-021142.JPG"
var image3 = new Image()
image3.src = "http://hmstack.files.wordpress.com/2011/07/swimming-for-the-disabled.jpg"
var image4 = new Image()
image4.src = "http://www.northantspfg.co.uk/resources/uploads/news/HiResLocalOffer13-041205.jpg"
</script>
</head>

    <img src='"images/pentagg.jpg'" width='"500'" height='"300'" name='"slide'" /></p>
    <script type='"text/javascript'">
    var step=1;
    function slideit()
    {
        document.images.slide.src = eval('"image'"+step+'".src'");
        if(step<4)
            step++;
        else
            step=1;
        setTimeout('"slideit()'",2500);
    }
    slideit();
    </script>

您在页面加载时调用函数slideit(),这就是它自动工作的原因,这样做,它应该工作:

<button onclick="slideit()">Next image</button>
<script type='"text/javascript'">
var step=1;
function slideit()
{
    document.images.slide.src = eval('"image'"+step+'".src'");
    if(step<4)
        step++;
    else
        step=1;
}
</script>