Bir düğmeye tıklandığında sayfayı en üste kaydıracak şekilde ayarladım. Ama önce sayfanın üst kısmının 0 olarak ayarlanıp ayarlanmadığını görmek için bir if deyimi kullandım. 0 değilse, sayfayı en üste kaydırmak için canlandırıyorum.
var body = $("body");
var top = body.scrollTop() // Get position of the body
if(top!=0)
{
body.animate({scrollTop:0}, '500');
}
Şimdi işin zor kısmı, sayfa yukarı kaydırıldıktan SONRA bir şeyi canlandırmak. Bu yüzden bir sonraki düşüncem, sayfa konumunun ne olduğunu bulmak. Bu yüzden öğrenmek için konsol günlüğünü kullandım.
console.log(top); // the result was 365
Bu bana 365 sonucunu verdi, sanırım en üste kaydırmadan hemen önce bulunduğum konum numarası buydu.
Sorum şu: Sayfa 0'a geldiğinde çalışan başka bir animasyon ekleyebilmek için konumu nasıl 0 olarak ayarlayabilirim?
Teşekkürler!
Bunu yapmak için, animate komutu için kaydırma animasyonu bittikten sonra çalışacak bir geri arama işlevi ayarlayabilirsiniz.
Örneğin:
var body = $("html, body");
body.stop().animate({scrollTop:0}, 500, 'swing', function() {
alert("Finished animating");
});
Bu uyarı kodunun olduğu yerde, daha fazla animasyon eklemek için daha fazla javascript çalıştırabilirsiniz.
Ayrıca, 'salınım' gevşemeyi ayarlamak için vardır. Daha fazla bilgi için http://api.jquery.com/animate/ adresine göz atın.
Onun yerine bunu dene:
var body = $("body, html");
var top = body.scrollTop() // Get position of the body
if(top!=0)
{
body.animate({scrollTop :0}, 500,function(){
//DO SOMETHING AFTER SCROLL ANIMATION COMPLETED
alert('Hello');
});
}
bunun için geri arama yöntemini kullanabilirsiniz
body.animate({
scrollTop:0
}, 500,
function(){} // callback method use this space how you like
);