jQuery: yeni eklenen öğeyi göstermek için pencere görünüm alanını taşı

Question

Bir 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 
}); 

içeren bir div değiştiren doc hazır jQuery parçacığım var. Bağlantı tıklandığında geçiş iyi çalışıyor. Sorun şu ki, div#addnote-area tarayıcının mevcut görüntü alanının altındaysa, gösterildiğinde orada kalıyor. Kullanıcının imlecini, tekstütata ve tüm textarea'ya pencerede görülebilir olmasını istiyorum.

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

Answer 1

atın scrollTo jQuery plugin. Bunu canlandırmak istiyorsanız, son kaydırma için milisaniye # sağlamak,

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

Veya:

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

Answer 2

jQuery en scrollTop da çalışır Sadece böyle bir şey yapabilirsiniz. gibi belirlemeyi deneyin:

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

Sen $(...).offset() kullanarak oldukça kolay yükseklik/genişlik alabilirsiniz.

Answer 3

scrollTo eklentisi

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

DÜZENLEME olmadan: Eh Eminim bu eski cevabı :) İşte

gelen çok puan almak bir bonus var, bu da hareketli olabilir.

Sadece animate() işlevini kullanın ve vücut etiketini hedefliyor:

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

Stackoverflow üzerinde deneyin! müfettiş konsolunu açın ve çalıştırın

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