iframe의 깜박임을 방지하려면 어떻게해야하나요?

Question

<a href="#" id="toggle01">CONTACT</a> 

<script> 
$('#toggle01').click(function() { 
    $('#contact').slideToggle("slow"); 
    return false; 
}); 
</script> 


<div id="contact"> 
123-456<br /> 
</div> 
<iframe id="player" src="http://www.youtube.com/embed/..."></iframe> 

모든 것이 여기에서 작동하지만 CONTACT 링크 및 div#contact 링크가 표시/숨김 상태가되면 iframe이 깜박이고 깜박입니다.
이 깜박임을 피하려면 어떻게해야합니까?

Answer 1

문제는 슬라이딩 애니메이션 인 것 같습니다. div가 애니메이션으로 처리되는 동안 iframe이 아래로 이동하고 다시 렌더링됩니다.

iframe 뒤에 div를 배치하거나 고정 된 높이로 다른 div 내에 캡슐화 할 수 있습니다. 예를 들어

:

<div style="height:50px;"> 
    <div id="contact"> 
     123-456<br /> 
    </div> 
</div> 

하지만 당신은 iframe 위의 빈 영역을 떠날 것이다.

Answer 2

스크립트가 올바르게 보이지만 깜박 거리는 이유가 표시되지 않습니다. 그러나 아래 스크립트를 사용해 볼 수 있습니까? e.preventDefault()를 추가하십시오.

<script> 
    $('#toggle01').click(function(e) { 
    e.preventDefault(); 
    $('#contact').slideToggle("slow"); 
    return false; 
    }); 
</script>