0

当您转到我网站的任何页面时，我正在使用 Jquery 为我的文本不透明度设置动画（从 0 到 1）。然后，在主导航单击时，它会初始化文本的动画以淡出，然后初始化链接并转到下一页。但是由于某种原因，当您在文本完全动画化之前单击主导航时，文本会淡出但会在完全不透明时闪烁，然后加载下一页的链接。我想知道是否有人知道如何纠正这个问题，我有下面使用的代码。我在想我需要以某种方式使用队列，但我又不确定这是否有帮助....这是我网站的链接，您可以在其中看到它闪烁 - > www.originalengine.com/test/iindex.html

我从 CSS 中的 0 不透明度开始

#AlternateContent{
position: relative;
opacity: 0;
}

然后我淡入文本 div

$('#AlternateContent').animate({opacity: '1'},{duration: 2650});

然后这就是我检查按下哪个导航按钮并为淡出设置动画的方式：

if (window.location.pathname === '/test/index.html')

{

$('#AboutButton').bind('click', AboutButton);
$('#PortfolioButton').bind('click', PortfolioButton);
$('#ContactButton').bind('click', ContactButton);

} 

function ContactButton(e) { 

$('#AlternateContent').animate({height: 0},{duration: 2650, queue: false}, 'swing')
.animate({opacity: '0'},{duration: 577, queue: false}, function(){
document.getElementById("AlternateContent").style.opacity=0;
window.location = 'contact.php';

});
}

就像我说的，这行得通，但最后我得到了闪光。转到我的网站（www.originalengine.com/test/iindex.html）并检查一下，如果您在页面之间快速按下导航项，在淡出时，文本会在进入下一页之前再次闪烁“on” ，我只想让它完全淡出！！

提前致谢

4

1 回答 1

0

可能是因为你有两个动画同时运行。尝试：

$('#AlternateContent').stop().animate({height: 0},{duration: 2650, queue: false}, 'swing')
于 2012-09-12T13:33:58.537 回答