使用 Jquery 在图像及其链接之间交替

Using Jquery to alternate between images and their links

本文关键字：链接 之间 Jquery 图像 使用      更新时间：2023-09-26

所以我正在尝试循环浏览两个div（每个div都有图像和链接）。我已经设法淡入和淡出每个div，因为我可以看到图像交替，但链接不交替。我的网页如下： 

<div class="fade1"><a href="link1"><img class="banner1" src="images/Home_Banner_1.jpg"></a></div>
<div class="fade2"><a href="link2"><img class="banner2" src="images/Home_Banner_2.jpg"></a></div>

.css：

.fade1 {opacity: 0;}

和我的j查询

<script>   
    $(document).ready(function() {
        function runIt () {
            var fade1 = $(".fade1");
            var fade2 = $(".fade2");
            fade1.delay(5000).fadeTo(3000, 1).delay(5000).fadeTo(3000, 0);
            fade2.delay(5000).fadeTo(3000, 0).delay(5000).fadeTo(3000, 1, runIt);
        }
        runIt();
    });
</script>

提前感谢任何和所有的帮助！

编辑：

因此，在下面的答案的基础上，我添加了回调 fade1.fadeTo，因为图像不透明度被打开和关闭，以便 href 将更新为图像。

fade1.delay(5000).fadeTo(3000, 1, function(){swap.attr("href",  link1)}).delay(5000).fadeTo(3000, 0, function(){swap.attr("href", link2)});

给链接类，并使用 $（'.yourlinkclass'）.attr（'href'，'yournewURL'） 编辑 href 属性;

相关文章：