jQuery显示div 2秒,然后在循环中隐藏4秒
问题描述:
如何显示div 2秒,然后在无限循环中隐藏它4秒?我使用jQuery的animate()
函数,因为我也想使用CSS转换。jQuery显示div 2秒,然后在循环中隐藏4秒
function animatedText() {
setTimeout(function() {
$('.text').animate({ opacity: 1 }, 200, function() {
setTimeout(function() {
$('.text').animate({ opacity: 0 }, 200);
}, 1800);
});
}, 3800);
}
setInterval(animatedText(), 6000);
这里是我的小提琴:https://jsfiddle.net/od6gm8t3/
答
我希望这会帮助你。请检查下面的代码。
function animatedText() {
$('.text').animate({ opacity: 1 }, 200, function() {
setTimeout(function() {
$('.text').animate({ opacity: 0 }, 200);
}, 2000);
});
setTimeout(function() {
animatedText();
},6000);
}
animatedText();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<i class="text">Animated Text</i>
你'setInterval'不运行任何东西,因为号召'animatedText'不返回任何东西。如果应该每6秒调用一次'animatedText',那么你需要编写'setInterval(animatedText,6000)'。而不是使用间隔和超时,你应该使用jQuery的'延迟'功能和动画的结束回调。 –
我明白了。谢谢! – Plastik