到目前为止,我可以将一个类应用到一个 div,但我希望它能将另一个类添加到另一个 div 以显示并淡出。
http://www.penguinie.co.uk/test/
我希望第一页淡出,关于页面淡入(或元素或联系页面)。
<li><a href="#about" onclick="$('#start').addClass('fadeOutUp'); $('#about').addClass('animated fadeInDown')">About</a></li>
这就是我用来使主页淡出的方法。 hidden 类用于隐藏关于页面,直到用户单击关于链接。
.hidden {
display: none;
}
.show {
display: inline;
}
最佳答案
您可以使用内置的 jQuery 方法来做到这一点 fadeIn和 fadeOut .
$('#start').fadeOut(500, function(){
$('#about').fadeIn(500);
})
这样,#about 将在#start 淡出后立即淡入。如果你想要不同的动画,你可以使用 animate指定动画的方法。
您也可以使用 setTimeout 方法,但据我所知,您希望一个 div 消失而另一个 div 紧随其后出现。我认为在这种情况下链接两个动画是更好的选择。
此外,@pszaba 是对的。您不应该使用 onclick 属性。您应该使用像 click 这样的事件处理程序像这样的处理程序:
$("#about").click(function(){
$('#start').fadeOut(500, function(){
$('#about').fadeIn(500);
});
});
(这段代码实际上没有意义,因为#about 元素是不可见的,所以它不能被点击:)请将它作为您自己实现的引用。)
关于javascript - 如何将一个类添加到一个div,让它等待一段时间,然后再将另一个类添加到另一个div?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19772770/