jQuery: move Fenster Ansichtsfenster frisch umgeschaltet Element zu zeigen,
Frage
Ich habe einen Schnipsel von jQuery in doc bereit, die ein div eine textarea
enthält umgeschaltet wird:
$('div#addnote-area').hide(); // hide the div
$('a#addnote-link').click(function() { // click event listener on link
$('div#addnote-area').toggle(); // toggle the hidden div
});
Das Toggle funktioniert gut, wenn auf den Link klicken. Das Problem, das ich habe, ist, dass, wenn div#addnote-area
unterhalb des Browsers aktuellen Ansichtsfenster ist, es bleibt, wenn es angezeigt wird. Ich würde die Cursor des Benutzers gerne das Textfeld zu gehen und für das gesamte Textfeld im Fenster sichtbar sein.
Lösung
Schauen Sie sich die scrollTo jQuery-Plugin . Sie können einfach so etwas tun:
$.scrollTo('div#addnote-area');
Oder, wenn Sie es animieren möchten, geben Sie die Anzahl der Millisekunden für das Scrollen zum letzten:
$.scrollTo('div#addnote-area', 500);
Andere Tipps
Ohne die scrollTo Plugin
$(window).scrollTop($('div#addnote-area').offset().top)
EDIT: Nun, ich sicher, dass viele Punkte aus dieser alten Antwort bekommen:)
Hier ist ein Bonus, kann dies auch animiert werden.
Sie einfach die animate()
Funktion verwenden und den Body-Tag Ziel:
$('body').animate({scrollTop:$('div#addnote-area').offset().top},500)
Versuchen Sie es auf Stackoverflow! Öffnen Sie den Inspektor Konsole und führen
$('body').animate({scrollTop:$('#footer').offset().top},500)
jQuery scrollTop
funktioniert auch. Versuchen Sie, wie:
$('#idOfElement').css('scrollTop', 10)
Sie können Hoehe / Breite ziemlich leicht mit $(...).offset()
.