gpt4 book ai didi

javascript - 如何添加链接切换图片?

转载 作者:行者123 更新时间:2023-11-28 10:52:14 25 4
gpt4 key购买 nike

我有一个 div,它每 5 秒更改一次图像,然后重复循环。它从文件夹中获取图像。如何将每张图片链接到网站或博客?

HTML:

<div><img id="img" src="pictures7/1.jpg">7</div>

JavaScript:

function displayImage(image) {
document.getElementById("img").src = image;
}

function displayNextImage() {
x = (x == images.length - 1) ? 0 : x + 1;
displayImage(images[x]);
}

function displayPreviousImage() {
x = (x <= 0) ? images.length - 1 : x - 1;
displayImage(images[x]);
}

function startTimer() {
setInterval(displayNextImage, 5000);
}

var images = [], x = -1;
images[0] = "pictures7/" + "1.jpg";
images[1] = "pictures7/" + "2.jpg";
for(var y=2;y<4;y++){
images[y]= "pictures7/" + (y+1) + ".jpg";
}

最佳答案

jquery cycle 是最好的解决方案(http://jquery.malsup.com/cycle/):

<div id="s1">
<div class="cell" id="s11"><a href="link1"><img src="1.jpg"></a></div>
<div class="cell" id="s11"><a href="link2"><img src="2.jpg"></a></div>
<div class="cell" id="s11"><a href="link3"><img src="3.jpg"></a></div>
</div>

<script>
$(function(){

$('#s1').cycle({
fx: 'fade',
width: '100%',
height: '100%',
pause: true,
timeout: 5000
});
});
</script>

关于javascript - 如何添加链接切换图片?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22749962/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com