Comment puis-je boucler une animation en continu dans jQuery?

J'ai besoin de savoir comment l'infini de la boucle de cette animation. C'est un texte de défilement de l'animation et j'ai besoin d'elle à répéter après c'est fini.

Voici le jQuery:

<script type="text/javascript"  src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script type="text/javascript"> 
    $(document).ready(function(){
        $(".boxtext").ready(function(){
            $(".boxtext").animate({bottom:"600px"},50000);
        });
    });
</script>

Voici le CSS pour ".boxtext"

.boxtext {
    position:absolute;
    bottom:-300px;
    width:470px;
    height:310px;
    font-size:25px;
    font-family:trajan pro;
    color:white;
}

source d'informationauteur user830593

  1. 14

    Faire une fonction et l'appel lui-même comme un rappel: 

    $(document).ready(function(){
    scroll();
}

function scroll() {
    $(".boxtext").css("bottom", "-300px");
    $(".boxtext").animate({bottom:"600px"}, 50000, scroll);
}

    Gardez à l'esprit, ce ne sera pas très fluide.

    EDIT: je n'ai pas pensé plus tôt. Mon erreur.

  2. 4

    Suivante devrait fonctionner.

    $(document).ready(function(){
    animateTheBox();
}); 

function animateTheBox() {
    $(".boxtext").animate({bottom:"600px"}, 50000, animateTheBox);
}
  3. 3

    probablement la solution la plus simple.

    var movement1 = function(speed){
  $(".mydiv").animate({"top": "100px"}, speed,function(){
      movement2(speed)
  });
}


var movement2 = function(speed){
  $(".mydiv").animate({"top": "120px"}, speed,function(){
      movement1(speed)
  });
}

  movement1(1000);

    c'est finalement s'appeler les uns les autres à l'infini.

  4. 1
    <script type="text/javascript"  src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script type="text/javascript"> 

$(function () {    
        move();
        });
function move(){
     $(".boxtext").ready(function(){
     $(".boxtext").animate({bottom:"600px"},50000,function(){
         $(".boxtext").css({"bottom":0}, move););

 });move();
 });
 </script>
  5. 0

    S'il vous plaît essayez ceci pour la boucle de l'animation sur le vol stationnaire. 

    function loopl(){
    $('.mCSB_container').animate({ "left": "+=80px" }, "800", 'linear', loopl  );
    }    

function loopr(){
        $('.mCSB_container').animate({ "left": "-=80px" }, "800", 'linear', loopr  );
    }
    function stop(){
        $('.mCSB_container').stop();
    }
    $( "#left" ).hover(loopl, stop);
    $( "#right" ).hover(loopr, stop);
  6. 0
    yourloop = setInterval(function() {
  //tasks
}, timeInMilliseconds );

    Profitez-en!

  7. 0

    Utilisation setInterval. De cette façon, vous pouvez répéter une fonction à l'infini après un certain laps de temps, comme à chaque seconde.

  8. 0
    <script type="text/javascript"> 
var e = document.getElementByClassName('boxtext')[0].style.bottom;
function reset(){
if(e === "599px"){e === 0 + "px"}
else{b += 1000}
}
setInterval(reset(),1);

$(document).ready(function(){
    $(".boxtext").ready(function(){
        $(".boxtext").animate({bottom:"600px"},b);
    });
});

</script>

    idont non, mais je pense que devraient avoir utilisé du javascript

  9. -3

    Comme ceci:

    <script>
$(document).ready(function()
{
    $(window).load(function()
    {
        var a="#bijin"
        var x=1000
        var y=1000

        for (var i=1 ; i<=100000 ; i++){
            $(a).slideUp(x).slideDown(y);  
        }
    });
});

</script>

    Exemple: http://www.hpcreating.com/effect/jquery2/slide4.html