2012-09-12 4 views
0

내 사이트의 페이지로 이동할 때 Jquery를 사용하여 텍스트 불투명도 (0에서 1까지)를 움직입니다. 그런 다음 기본 탐색 버튼을 클릭하면 페이드 아웃 할 텍스트의 애니메이션을 초기화 한 다음 링크를 초기화하고 다음 페이지로 이동합니다. 그러나 텍스트가 완전히 애니메이션되기 전에 기본 탐색을 클릭하는 몇 가지 이유 때문에 텍스트가 흐리게 표시되지만 불투명도가 완전히 깜박이고 다음 페이지의 링크가로드됩니다. 누군가가 이것을 수정하는 방법을 알고 있다면 아래 코드를 사용하고 있는지 궁금합니다. 어떻게 든 대기열을 사용해야한다고 생각했지만 다시 도움이 될지 확신 할 수 없습니다. 다음은 내 사이트 링크입니다. 깜박임을 볼 수 있습니다. -> www.originalengine.com/test/iindex.html.animation 태그를 사용하여 Jquery에서 깜박이는 애니메이션

나는

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

다음이 내가 탐색 버튼을 누르면 한 확인하고 페이드 아웃 애니메이션을 어떻게 다음

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

내가 텍스트 DIV 페이드 CSS에서 0 불투명도로 시작 :

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)로 이동하여 확인하십시오. 페이드 아웃하는 동안 페이지 사이에서 nav 항목을 빠르게 누르면 다음 페이지로 이동하기 전에 텍스트가 다시 '깜박입니다'. , 나는 그것이 단지 완전히 사라지 길 원한다 !!

미리 감사드립니다.

답변

0

아마도 두 개의 애니메이션이 동시에 실행 중이기 때문일 수 있습니다. 시도 :

$('#AlternateContent').stop().animate({height: 0},{duration: 2650, queue: false}, 'swing') 
관련 문제