✔ Slide statt Jump

[tvtotal]

$("#dsa").click(function(){   
    $(".mytrack').stop().animate({scrollTop:-60},400,'swing',function(){
     $(this).scrollTop(0).find('span:first').before($('span:last', this));
    });
   });

Hallo...
das Skript läßt spans im DIVs mit Inhalt nach unten sprigen. Wie kann ich daraus einen Slide nach unten machen?

Dankeschön

 

[SpiceLab]

duration "400" definiert eine Animationsdauer von 0,4 Sekunden.

Ressourcen zum Thema:

http://api.jquery.com/animate/
http://pixelbar.be/blog/mit-jquery-scrollen-gewusst-wie/
http://www.paulund.co.uk/smooth-scroll-to-internal-links-with-jquery
http://jsfiddle.net/gabrieleromanato/ChDdE/ -hier kann mit duration (800) experimentiert werden-

[edit]Links ergänzt[/edit]​

 

[tvtotal]

$("#dsa").click(function(){  
    $(".mytrack').stop().animate({scrollTop:60},400,'swing',function(){
    $(this).scrollTop(0).find('span:last').after($('span:first', this));
   });
  });

Hallo und danke für die Antwort. Das ist ein anderes Problem. Wenn ich die andere Richtung wähle (nach oben), geht es wie gewohnt, d.h. es slided. .mytrack hat pos relative.

 

[SpiceLab]

Die Richtung sollte hier keine Rolle spielen - siehe meinen zuletzt empfohlenen Link http://jsfiddle.net/gabrieleromanato/ChDdE/

In dem jsfiddle-Demo kannst du zur Kontrolle mit den beiden duration-Werten experimentieren.

Andernfalls poste mal auf http://jsfiddle.net dein Modell.

 

[tvtotal]

Anbei mal mein Problem: http://jsfiddle.net/qjjvntom/

Nach oben slide, nach unten wird nur gesprungen...

 

[tvtotal]

http://jsfiddle.net/qjjvntom/1/ so sieht man die Richtung besser

 

[Quaese]

Hi,

das Problem besteht darin, dass scrollTop keine Werte kleiner als Null akzeptiert. D.h. du musst beim Sliden nach unten das letzte Element vor der Animation an den Anfang der "Slideliste" einhängen. Weiterhin musst du noch den scrollTop-Wert auf die Höhe des eingehängten Elementes setzen.

Siehe hier: http://jsfiddle.net/Quaese/qjjvntom/2/

Ciao
Quaese

 

[SpiceLab]

das Problem besteht darin, dass scrollTop keine Werte kleiner als Null akzeptiert.

Danke für den Einwurf @Quaese

Und keine meiner genannten Ressourcen setzt auf negative Werte, um geschmeidig nach unten zu scrollen

 

[tvtotal]

Spitze. Vielen Dank !!!

Hallo zusammen,

ich habe hier noch einmal eine Frage zu: Ist es möglich, mit einem Link den Slider http://jsfiddle.net/Quaese/qjjvntom/2/ von Quaese (vielen Dank nochmal) zu animieren und auf das aktive Element zu setzen und dieses nach oben zu "fahren"?

Ich füge die Klasse acitve über einen Link ein, sodass ich dann

<span class="active">

habe. Da es immer ein unsichtbares Element gibt, müsste ich den Slider mit dem Link bewegen.

Vielen Dank und schönen Abend!

Ich habe jetzt alles durchprobiert. Ist es überhaupt möglich, den Slide über mehrere Bildhöhen zu machen?

Sind alle in Ferien?