lostyazilim
tr.link

Scroll Aşağı İnince Div'in Gizlenmesi

7 Mesajlar 3.473 Okunma
lstbozum
tr.link

Eiffel Eiffel WM Aracı Kullanıcı
  • Üyelik 30.08.2016
  • Yaş/Cinsiyet 34 / E
  • Meslek Senior Backend Dev
  • Konum Bursa
  • Ad Soyad C** B**
  • Mesajlar 316
  • Beğeniler 93 / 82
  • Ticaret 9, (%89)
Merhaba,

jQuery Javascript bilgim çok fazla yok. Saatlerdir çok basit olan bir olayı yapmaya çalışıyorum ama bir türlü beceremedim. Olay şu şekilde:

Adı " #ustbilgi " olan bir div'imiz var. Sayfa aşağı indirildiğinde bu div yok olacak. Scroll sadece sayfanın en üstündeyken görünecek. Yardımcı olabilir misiniz?
 

 

wmaraci
reklam

Eiffel Eiffel WM Aracı Kullanıcı
  • Üyelik 30.08.2016
  • Yaş/Cinsiyet 34 / E
  • Meslek Senior Backend Dev
  • Konum Bursa
  • Ad Soyad C** B**
  • Mesajlar 316
  • Beğeniler 93 / 82
  • Ticaret 9, (%89)
Bir Allah ın kulu yok mudur yardım edebilecek? 😢
 

 

BatuhanO BatuhanO Full-Stack Developer Kullanıcı
  • Üyelik 24.09.2017
  • Yaş/Cinsiyet 25 / E
  • Meslek Game-Web Developer & Designer
  • Konum İstanbul Anadolu
  • Ad Soyad B** Ö**
  • Mesajlar 27
  • Beğeniler 20 / 10
  • Ticaret 9, (%100)
Eiffel ScrollMe olayı gibi bir şeyden mi bahsediyorsunuz?
http://scrollme.nckprsn.com/
Scroll hareketleriyle divlere animasyon opacity vs. verilebiliyor.. İsterseniz yardımcı olabilirim
 

 

Sinan Sinan Grana Kullanıcı
  • Üyelik 18.07.2011
  • Yaş/Cinsiyet 31 / E
  • Meslek Yazılım Geliştirme Uzmanı
  • Konum İstanbul Avrupa
  • Ad Soyad S** Y**
  • Mesajlar 3509
  • Beğeniler 1321 / 1320
  • Ticaret 97, (%100)
https://prnt.sc/ixlhyy

Şöyle birşey yapmıştım. Mobil menü header boyu kadar aşağı inince ortaya çıkıyor. Kodlardan anlamazsan özelden yazarsın yardımcı olurum.
 

 

wmaraci
wmaraci

ahmetp ahmetp WM Aracı Kullanıcı
  • Üyelik 19.05.2017
  • Yaş/Cinsiyet 41 / E
  • Meslek Diğer
  • Konum Diğer
  • Ad Soyad A** P**
  • Mesajlar 332
  • Beğeniler 39 / 144
  • Ticaret 1, (%100)
Şöyle bir örnek var: http://jsfiddle.net/MFUw3/239/

https://stackoverflow.com/questions/13250325/show-hide-div-on-scroll
 

 

vkonca vkonca WM Aracı Kullanıcı
  • Üyelik 12.08.2013
  • Yaş/Cinsiyet 28 / E
  • Meslek Web Developer
  • Konum Tekirdağ
  • Ad Soyad V** K**
  • Mesajlar 294
  • Beğeniler 73 / 63
  • Ticaret 0, (%0)

$(function(){
var stickyHeaderTop = $('header').offset().top;

$(window).scroll(function(){
if( $(window).scrollTop() > stickyHeaderTop ) {
$('.divadi').css({display: 'none'}); // Buradaki kodla scrol aşağıya indiğinde istediğin divi kapatabilirsin.

} else {
$('.divadi').css({display: 'block'}); // buradaki kodla ise yukarıya çıktığında kapattığın divi tekrar açabilirsin.
}
});
});


yukardaki kodda açıklama satırlarını yazdım onları değiştirerek işlemini koalyca yapabilirsin. Kodları footer.php dosyana yada body'in en altına koy
teknobilimadami

kişi bu mesajı beğendi.

VBA Developer

Eiffel Eiffel WM Aracı Kullanıcı
  • Üyelik 30.08.2016
  • Yaş/Cinsiyet 34 / E
  • Meslek Senior Backend Dev
  • Konum Bursa
  • Ad Soyad C** B**
  • Mesajlar 316
  • Beğeniler 93 / 82
  • Ticaret 9, (%89)

BatuhanO adlı üyeden alıntı

Eiffel ScrollMe olayı gibi bir şeyden mi bahsediyorsunuz?
http://scrollme.nckprsn.com/
Scroll hareketleriyle divlere animasyon opacity vs. verilebiliyor.. İsterseniz yardımcı olabilirim


evet bu tarz bir şey arıyorum. akşama göz atacağım teşekkürler

Sinan adlı üyeden alıntı

https://prnt.sc/ixlhyy

Şöyle birşey yapmıştım. Mobil menü header boyu kadar aşağı inince ortaya çıkıyor. Kodlardan anlamazsan özelden yazarsın yardımcı olurum.


teşekkür ederim hocam mobilim şuan akşama bakıcam



çok teşekkürler

vkonca adlı üyeden alıntı


$(function(){
var stickyHeaderTop = $('header').offset().top;

$(window).scroll(function(){
if( $(window).scrollTop() > stickyHeaderTop ) {
$('.divadi').css({display: 'none'}); // Buradaki kodla scrol aşağıya indiğinde istediğin divi kapatabilirsin.

} else {
$('.divadi').css({display: 'block'}); // buradaki kodla ise yukarıya çıktığında kapattığın divi tekrar açabilirsin.
}
});
});


yukardaki kodda açıklama satırlarını yazdım onları değiştirerek işlemini koalyca yapabilirsin. Kodları footer.php dosyana yada body'in en altına koy


çok teşekkür ederim hocam emeğiniz için akşama hemen deneyeceğim
vkonca

kişi bu mesajı beğendi.

Site Ayarları
  • Tema Seçeneği
  • Site Sesleri
  • Bildirimler
  • Özel Mesaj Al