2 Stimmen

Eine jQuery-Bildgruppenanimation

Ich habe ein div mit drei gleichen Bildern.

Jedes hat eine unterschiedliche "absolute" Position, sodass sie alle eine Reihe bilden und ihr übergeordnetes div versteckt überströmt wird.

Also animiere ich sie gleichzeitig als Gruppe von links nach rechts mit diesem Code:

$(function(){ 
    movelights();
  });

  function movelights(){
    for(x=0;x<3;x++)
    {
       $('div img:eq('+x+')').animate({left: (1400 - x*800)},24000);
    }
  };

Mein Problem ist: Wie kann ich ein Bild an eine bestimmte Startposition zurückgeben, bevor die anderen wieder in die Rechtskante des divs gelangen, sodass das animierte Muster sich wiederholt!

Also interessiere ich mich für beides:

  • wie man ein Bild von hinten in die Reihe einreiht
  • wie man das animierte Muster wiederholt

Hoffentlich war ich klar genug, Englisch ist nicht meine Muttersprache.

Hier ist etwas zusätzlicher Code:

div{
width:1000px;
overflow:hidden;
position:relative;
}

all img{  
  display:block;  
  position:absolute;
  left:120px;  
}
img2{  
  left:-678px;
}
img3{  
  left:-1400px;
}

1voto

irana Punkte 26

Ich hatte das gleiche Problem. Versuchen Sie timer = setTimeout(functionname to loop, 0); zu verwenden.

Immer, wenn ich eine jQuery-Frage stelle, antwortet mir jemand in der Regel mit einem Link zu einem aufgeblähten Plugin, das jemand anders gebaut hat. Die Frage war, wie man etwas macht, nicht wo man etwas herunterladen kann.

CodeJaeger.com

CodeJaeger ist eine Gemeinschaft für Programmierer, die täglich Hilfe erhalten..
Wir haben viele Inhalte, und Sie können auch Ihre eigenen Fragen stellen oder die Fragen anderer Leute lösen.

Powered by:

X