lostyazilim
tr.link

Jquery ile yukarı çık uygulaması

5 Mesajlar 3.171 Okunma
lstbozum
tr.link

BrutalStar BrutalStar Yazılımcı Kullanıcı
  • Üyelik 26.02.2013
  • Yaş/Cinsiyet 30 / E
  • Meslek Yazılımcı
  • Konum İstanbul Avrupa
  • Ad Soyad U** C**
  • Mesajlar 697
  • Beğeniler 149 / 137
  • Ticaret 0, (%0)
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)
 

 

BLOG | http://safkaninsan.blogspot.com/
wmaraci
reklam

Merkur Merkur WM Aracı Kullanıcı
  • Üyelik 27.11.2012
  • Yaş/Cinsiyet 38 / E
  • Meslek web tasarım
  • Konum İstanbul Anadolu
  • Ad Soyad ** **
  • Mesajlar 238
  • Beğeniler 76 / 61
  • Ticaret 0, (%0)
konu dışı olucak ama söylemeden edemeyeceğim. kaynak verdiğin sitenin sol en aşşağısında gülen surat şeker tadında olmuş :D nasıl fark ettiysem artık. :D
BrutalStar

kişi bu mesajı beğendi.

MertKoseoglu MertKoseoglu Üyeliği Durdurulmuş Banlı Kullanıcı
  • Üyelik 12.07.2013
  • Yaş/Cinsiyet 29 / E
  • Meslek x
  • Konum Ankara
  • Ad Soyad M** K**
  • Mesajlar 659
  • Beğeniler 120 / 168
  • Ticaret 3, (%100)
Gayet basit ve kullanışlı, tesekkurler
 

 

BrutalStar BrutalStar Yazılımcı Kullanıcı
  • Üyelik 26.02.2013
  • Yaş/Cinsiyet 30 / E
  • Meslek Yazılımcı
  • Konum İstanbul Avrupa
  • Ad Soyad U** C**
  • Mesajlar 697
  • Beğeniler 149 / 137
  • Ticaret 0, (%0)

Merkur adlı üyeden alıntı

konu dışı olucak ama söylemeden edemeyeceğim. kaynak verdiğin sitenin sol en aşşağısında gülen surat şeker tadında olmuş :D nasıl fark ettiysem artık. :D


Evet fark etmesi biraz zor. :)
 

 

BLOG | http://safkaninsan.blogspot.com/
wmaraci
wmaraci

lordleos lordleos WM Aracı Kullanıcı
  • Üyelik 04.03.2012
  • Yaş/Cinsiyet 46 / K
  • Meslek danışman
  • Konum
  • Ad Soyad L** K**
  • Mesajlar 148
  • Beğeniler 29 / 28
  • Ticaret 0, (%0)
yukarı çık aşağı in kodu
http://webseyyahi.blogspot.com/2013/03/yukar-ck-asagya-in-butonu.html
 

 

wmaraci
wmaraci
Konuyu toplam 1 kişi okuyor. (0 kullanıcı ve 1 misafir)
Site Ayarları
  • Tema Seçeneği
  • Site Sesleri
  • Bildirimler
  • Özel Mesaj Al