2014-04-14 4 views
0

안녕하세요. 이상한 점이 있습니다. 웹 사이트 위쪽으로 열리는 애니메이션이 있습니다.하지만 여는 후에는 오버레이 아래의 링크가 작동하지 않는 것 같습니다. 문제를 설명하기 위해 jsfiddle을 만들었습니다. 항상 내 다시는 제 시간에 벽에 그대로JQuery 애니메이션 오버레이 문제

Fiddle me this!

var removeWhenOpen = true; var done = false; 
var timer0; 
jQuery(document).ready(function() { 
    $('#doors').hover(function() { 
     jQuery('#door-left').stop().animate({left:-500}, 1500, function() { if (removeWhenOpen) $(this).remove(); done=true; }); 
     jQuery('#door-right').stop().animate({right:-500}, 1500, function() { if (removeWhenOpen) $(this).remove(); }); 
     var timer0 = setTimeout(function() { 
      jQuery('#ladyonthelake').stop().animate({opacity:0}, 2000); 
     }, 5); 
    }, function() { 
     jQuery('#door-left').stop().animate({left:0}, 250); 
     jQuery('#door-right').stop().animate({right:0}, 250); 
     if (!done) { 
      if (timer0) clearTimeout(timer0); 
      jQuery('#ladyonthelake').stop().fadeIn(); 
     } 
    }) 
}); 


<div id="doors"> 
      <img src="http://theitentrepreneurs.com/temp/ladyonthelake.jpg" width="347" height="520" border="0" id="ladyonthelake" /> 
      <div id="door-left" class="door"><div class="inner"></div><img src="http://theitentrepreneurs.com/temp/doorleft.png" /></div> 
      <div id="door-right" class="door"><div class="inner"></div><img src="http://theitentrepreneurs.com/temp/doorright.png" /></div> 
     </div> 

어떤 도움을 크게 감상 할 수있다, 그래서 아무것도 사람이 좋은 것입니다 제공 할 수 있습니다!

감사 브라이언

답변

0

귀하의 문제는 애니메이션이 완료된 후 문 div가 제거되지 않아 링크 위의 절대 위치에있는 요소가 클릭 가능성을 방해한다는 것입니다. http://jsfiddle.net/gravitybox/fFaac/1/

:

jQuery('#door-left').stop().animate({left:-500}, 1500, function() { if (removeWhenOpen) $("#doors").remove(); done=true; }); 

바이올린을 추가

2

당신은 $('#doors')을 제거하는 것을 잊었다.