Web sayfası yukarda iken görünmez olan, aşağı inildiğinde görünür hale gelen “yukarı çık” çapası yapalım.

Adım 1: Bir resim oluşturalım, istediniz resmi kullanın ve bir ID değeri verin.



Adım 2: Resim sayfanın sağ alt köşesinde sabi kalacak ve görünmez olacak.
#ScrollTop{
position: fixed;
right: 20px;
bottom: 15px;
cursor: pointer;
display: none;
}

Adım 3: Tıkladığımızda sayfayı yukarı kaydıracak.
$("#ScrollTop").click(function() {
$("html,body").stop().animate({ scrollTop: "0" }, 1000);
});


Adım 4: Resim yukarı çıkıldığında görünmez, aşağı inildiğinde görünür olacak.
$(window).scroll(function() {
var length = $(document).scrollTop();
if (length > 300){
$("#ScrollTop").fadeIn(500);
}
else{
$("#ScrollTop").fadeOut(500);
}
});


300 yazan değer sayfanın kaç pixel aşağı kaydırıldığında resmin görünür olacağını belirler.

Kaynak: Sayfada yukarı çık uygulaması (jQuery)