jQuery: przenieść okno rzutnia pokazać świeżo przełączać między opcjami elementu

Question

Mam urywek jQuery w dok gotowy który przełącza div zawierający textarea:

$('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 
}); 

przełącznik działa prawidłowo po kliknięciu na link. Problemem, który mam, jest to, że jeśli div#addnote-area znajduje się poniżej aktualnej rzutni przeglądarki, pozostaje tam po jej wyświetleniu. Chciałbym, aby kursor użytkownika znalazł się w obszarze tekstowym i aby cały tekst był widoczny w oknie.

Click here to see an image http://i50.tinypic.com/5ousuv.png

Answer 1

Zapoznaj się scrollTo jQuery plugin. Można po prostu zrobić coś takiego:

$.scrollTo('div#addnote-area'); 

Albo, jeśli chcesz go ożywić, zapewniają # milisekund do przewijania trwać: działa także

$.scrollTo('div#addnote-area', 500); 

Answer 2

jQuery scrollTop. Spróbuj ustawić jak:

$('#idOfElement').css('scrollTop', 10) 

można uzyskać wysokość/szerokość dość łatwo za pomocą $(...).offset().

Answer 3

Bez Wtyczka scrollTo

$(window).scrollTop($('div#addnote-area').offset().top) 

EDIT: No ja na pewno dostać dużo punktów od tej starej odpowiedź :)

Oto premia ta może być również animowane.

Wystarczy skorzystać z funkcji animate() i kierować tag ciała:

$('body').animate({scrollTop:$('div#addnote-area').offset().top},500)

Wypróbuj Stackoverflow! Otwórz konsolę inspektora i uruchomić

$('body').animate({scrollTop:$('#footer').offset().top},500)