2014-05-13 3 views
0

내 코드에 왜 이렇게 큰 지연이 있습니까? 이 div를 슬라이드에 넣고 창 크기에 따라 슬라이드 아웃 시키길 원합니다. 그러나 매 시간마다 지연이 있습니다. 그것은 결코 같은 길이가 아닙니다. 타임 아웃 기능을 사용해야합니까? 아니면 내 코드에 문제가 있습니까? 여기 Jquery Resize Delay

<!DOCTYPE html> 
<html> 
<head><style type="text/css">div { 
    background-color: brown; 
    width: 100px; 
    height: 100px; 
    position: relative; 
    display: none; 
    left: -120px; 
} 
</style> 


<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script> 
<title>HTML5, CSS3 and JavaScript demo</title> 
</head> 
<body> 

    <div style="display: block; left: 0px;" id="navg">Chocolate!</div> 


<script>var navg = $("#navg"); 
var wind = $(window); 

wind.load(function() { 
    if (wind.width() > 900) { 
    navg.show(); 
    navg.animate({ 
     left: "0px" 
     }, 1000); 
    } 
}); 

wind.resize(function() { 
    if ((wind.width() < 900) && (navg.is(":visible"))) { 
    navg.animate({"left":"-120px"}, 1000, function() { 
     $(this).hide(); 
    }); 
    } else if ((wind.width() >= 900) && (navg.is(":hidden"))) { 
    navg.show(function() { 
     navg.animate({"left":"0px"}, 1000); 
    }); 
    } 
}); 
</script></body> 

는 Liveweave의 코드에 대한 링크입니다 : http://liveweave.com/HWpQUe 무슨 뜻인지의 더 나은 아이디어를 얻을 크기를 조정하십시오.

+3

나를 위해 의도 된대로 작동하는 것으로 보입니다. 지연으로, 광장의 속도가 느린 것을 의미합니까? 그렇다면 '1000'(코드에서 3 개의 인스턴스를 '200'또는 '400')으로 줄이고 무엇이 효과가 있는지 확인하십시오. –

+0

게시물 함자 주셔서 감사합니다. 그러나 제가 말하고자하는 것은 창이 여러 번 크기를 조정하면 함수를 트리거하지 않는다는 것입니다. 때로는 창 크기를 조정하고 팝업이 나타나기까지 30 초 동안 기다려야합니다. – fluke4

+0

아, 무슨 일이 일어나고있는간에 여러 애니메이션이 서로 실행되어 서로를 멈추게 할 가능성이 있습니다. 이전 애니메이션을 모두 중단하려면 각 애니메이션을 시작하기 전에 http://api.jquery.com/finish/를 사용하는 것이 좋습니다. –

답변

0

거기에 무슨 일이 일어나고있는간에 여러 애니메이션이 서로 실행되고 서로를 멈추게하는 것이 있습니다. 이전 애니메이션을 모두 중단하려면 각 애니메이션을 시작하기 전에 api.jquery.com/finish를 사용하고 싶을 것입니다.