div 태그에 애니메이션을 적용한 후 jquery를 사용하여 숨기기

div 태그를 300px 왼쪽으로 움직이려하고 3 초 후 숨기기로하고 8 초마다이 전체 과정을 수행하고 싶습니다. 내 코드에서는 한 번만 수행합니다. 그것은 전체 세차를 반복하지 않습니다. 다음은 내 코드입니다.div 태그에 애니메이션을 적용한 후 jquery를 사용하여 숨기기

<!DOCTYPE html> 
<html> 
    <head> 
     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"> </script> 
<script> 
$(document).ready(function(){ 
window.setInterval(function(){ 
var div=$("div"); 
div.animate({left:'300px'},"slow"); 
setTimeout(function(){ 
div.animate({opacity:'0'},"slow"); }, 3000); 

},8000); 
}); 
</script> 
</head> 

<body> 

    <div style="background:#98bf21;height:100px;width:100px;position:absolute;"> 
    </div> 

</body> 
</html>

출처

2014-09-17 gayan

$(document).ready(function(){ 

    (function moveit(){ 
     $("div") 
      .css({opacity:'1',left:0})// reset (assuming you want it back visible and on the left) 
      .animate({left:'300px'},"slow")// move right 
      .delay(3000)// wait 3 seconds 
      .animate({opacity:'0'},"slow");// fade out 
     setTimeout(moveit, 8000);//do this again after 8 seconds 
    })(); // self-execute. 

});

http://jsfiddle.net/99phku9d/

출처

2014-09-17 16:55:56 Moob

멋지을! 고마워 제대로 작동합니다. B-) – gayan

당신은 jQuery를 repeat 기능을 사용할 수 있습니다

$(document).ready(function(){ 
    $("div").repeat(8000).animate({left:'300px'},"slow").setTimeout(function(){ 
    div.animate({opacity:'0'},"slow"); }, 3000); 

});

출처

2014-09-17 17:04:24 optimus

잡히지 않은 TypeError : undefined가 함수가 아닙니다 (http://jsfiddle.net/8fmwkvyt/1/) – Moob

div 태그에 애니메이션을 적용한 후 jquery를 사용하여 숨기기

답변

관련 문제