Ekranda olmayan elementleri silme yada gizleme

29-01-2016, 01:45:37

Selamlar arkadaşlar Scroll aşağıya indikçe veri (resim) yüklenen bir sayfam var, Yüklenen verilerden ve eski verilerden ekranda görünmeyenlerin bir elementinin içini sildirmem gerekiyor bunu nasıl yapabilirim;

Örneklemek gerekirse;

Açılış sayfam şu şekilde;

<div class="resimVeri">
    <div class="baslik">test</div>
    <div class="resim"></div>
    <div class="silinmesini_istedigim_div">Silinecek veri</div>
</div>
<div class="resimVeri">
    <div class="baslik">test</div>
    <div class="resim"></div>
    <div class="silinmesini_istedigim_div">Silinecek veri</div>
</div>
<div class="resimVeri">
    <div class="baslik">test</div>
    <div class="resim"></div>
    <div class="silinmesini_istedigim_div">Silinecek veri</div>
</div>

Scroll ile alta gelince yüklenen veri;

<div class="resimVeri">
    <div class="baslik">test</div>
    <div class="resim"></div>
    <div class="silinmesini_istedigim_div">Silinecek veri</div>
</div>

Bunlardan Tarayıcı ekranında görünmeyenlerden <div class="silinmesini_istedigim_div">Silinecek veri</div> elementinin içini silmek istiyorum, Bunu nasıl yaparım?

29-01-2016, 16:40:18

#2

Kocaportal

Selamlar,
Window scroll event'ini takip ederek, elementin top-offset'i ile kıyaslayan bir fonksiyon yazarak yapabilirsiniz.

Alıntı

$(window).scroll(function (event) {
var st = $(this).scrollTop();
if (st > 300) {
$('.element').remove();
}
}

gibi..
Duruma göre 300 yazdığım yerde ilgili elementin offset().top değerini,
remove yazdığım yerde de elemente ne yapmak istiyorsanız onu kullanabilirsiniz.
fonksiyon üzerindeki event değerini de debug ederseniz, üzerindeki property'leri görebilirsiniz