gpt4 book ai didi

javascript - 图像之间连续淡入淡出和旋转

转载 作者:行者123 更新时间:2023-11-28 06:29:43 24 4
gpt4 key购买 nike

我正在尝试寻找在图像之间连续淡入淡出和旋转的代码。我下载了适用于 JSFiddle 的脚本,但在我申请我的网站时却不起作用。 。有人能帮我吗?这是代码:

    <head>

<script type="text/javascript">


$('.fadein img:gt(0)').hide();

setInterval(function () {
$('.fadein :first-child').fadeOut()
.next('img')
.fadeIn()
.end()
.appendTo('.fadein');
}, 4000); // 4 seconds


</script>

</head>

<style>

.fadein {
position:relative;
height:320px;
width:320px;
}

.fadein img {
position:absolute;
left:0;
top:0;
}

</style>

<div class="fadein">
<img src="http://farm9.staticflickr.com/8359/8450229021_9d660578b4_n.jpg">
<img src="http://farm9.staticflickr.com/8510/8452880627_0e673b24d8_n.jpg">
<img src="http://farm9.staticflickr.com/8108/8456552856_a843b7a5e1_n.jpg">
<img src="http://farm9.staticflickr.com/8230/8457936603_f2c8f48691_n.jpg">
<img src="http://farm9.staticflickr.com/8329/8447290659_02c4765928_n.jpg">
</div>

最佳答案

首先,确保您从 CDN 或准确引用 Jquery 文件的脚本标记中包含 Jquery。例如,如果 Jquery-1.12.0.min.js 位于您的 js 文件夹中,则您的脚本如下所示:

<script src="js/jquery-1.12.0.min.js"></script>

然后,将旋转器脚本放在页面末尾,或包装在 document.ready 函数中,如下所示:

<script>
$(function(){
//all your codes
});
</script>

关于javascript - 图像之间连续淡入淡出和旋转,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34812657/

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