0
我想连续显示和隐藏两个页面元素。连续动画显示或隐藏元素而不褪色
这是代码:
$(document).ready(function() {
var continuous = function() {
setTimeout(function() { $("#Mass_alert").css('display','block'); $("#Devotion_alert").css('display','none'); },1500);
setTimeout(function() { $("#Mass_alert").css('display','none'); $("#Devotion_alert").css('display','block'); },1500);
};
setInterval(continuous,500);
});
这是HTML:
<div id="Mass_alert" class="alert" style="position: relative; top: 3px; margin: 0 auto; text-align: center; width:100%; height: 20px;">Mass alert</div>
<div id="Devotion_alert" class="alert" style="position: relative; top: 3px; margin: 0 auto; text-align: center; width:100%; height: 20px;">devotion alert</div>
我得到正确的效果一次。我应该在上面的代码中更改以获得持续的效果。我不想使用fadeToggle,因为我实际上需要display:none
设置。如果我不这样做,那么隐藏元素留下的空间会干扰另一个元素的放置。
谢谢。这工作。 – user823527
有没有办法将淡入淡出的动画添加到该切换? – user823527
@ user823527你可以使用'fadeToggle',虽然这看起来很奇怪,'slideToggle'可能会更好。 – Yoshi