我正在尝试在滑块上创建文本动画循环...
我尝试循环但它不起作用..
你能告诉我如何永远循环这个脚本吗?谢谢
<script>
$(document).ready(function() {
$("#header").hide();
var headerOne='I';
var headerTwo='Am';
var headerThree='So';
var headerFour='Cool';
$("#header").html(headerOne);
$("#header").fadeIn(1000);
$('#header').delay(1000).fadeOut(1000,function(){
$(this).html(headerTwo).fadeIn(1000);
$('#header').delay(1000).fadeOut(1000,function(){
$(this).html(headerThree).fadeIn(1000);
$('#header').delay(1000).fadeOut(1000,function(){
$(this).html(headerFour).fadeIn(1000).delay(1000).fadeOut(1000);
});
});
});
});
</script>
Thanks!
如果你稍微清理一下你的代码。你可以意识到setInterval
不需要。只需利用最后一个回调来重复动画即可。
$(function () {
var $header = $("#header");
var header = ['I', 'Am', 'So', 'Cool'];
var position = -1;
!function loop() {
position = (position + 1) % header.length;
$header
.html(header[position])
.fadeIn(1000)
.delay(1000)
.fadeOut(1000, loop);
}();
});
在这里查看。
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)