2009-06-15 7 views
3

J'essaye de faire une page Web qui emploie un div mobile qui se déplace lentement vers la gauche. Il y a aussi un autre div qui se déplace au-dessus de celui-ci vers la droite qui donne un effet 3D (mais c'est à côté du point). Ce que j'essaie de faire en ce moment a fait un div de 7000px qui se déplace lentement vers la gauche (en animant la propriété "right" de CSS avec jQuery animate()), mais après tout est déplacé, l'animation se termine. Y a-t-il un moyen de faire une largeur infinie du div ou au moins de le ramener au début (un peu comme une chose qui se déplace dans une caisse d'épicerie) pour que l'animation ne s'arrête jamais?Comment faire un mouvement infini d'une div?

Je pense que cela nécessite quelques divs séparés, chacun une fois qu'il atteint sa fin, remonte, mais je ne peux pas comprendre comment faire cela comme je suis un développeur jQuery débutant.

Répondre

3

MISE À JOUR

En prenant en compte votre exemple à http://nth.brandonwang.org/stuhf2/simpleindex.html vous pouvez le corriger en ajoutant simplement un rappel à la fin, votre script doit ressembler à ceci:

$(document).ready(function() { 
    animateRight(); 
    animateLeft(); 
}); 

function animateRight() 
{ 
    $('#lightright').css ("left", "100%"); 
    $('#lightright').animate({left:'0%'},1500, "", animateRight); 
} 

function animateLeft() 
{ 
    $('#lightleft').css ("right", "100%"); 
    $('#lightleft').animate({right:'0%'},1600, animateLeft); 
} 

Fondamentalement, nous venons de réinitialiser le animation css propriété et début de l'effet d'animation, la durée de l'animation est plus rapide dans ce code juste pour aider à voir l'effet.

espoir qu'il vous aide à

+0

Je ne comprends pas exactement comment qui fonctionne; Vous pouvez voir mon travail ici: nth.brandonwang.org/stuhf2/ Si vous attendez assez longtemps, vous remarquerez que le mouvement disparaît lorsque les divs se déplacent de l'écran. –

+0

Ok, je viens de faire une nouvelle démo avec juste ce dont vous avez besoin, j'espère que ça vous aide – albertein

+0

Que font deltaX et deltaT? –

Questions connexes