Görünür Seçici
:visible seçicisi, sayfadaki tüm görünür
elementleri seçer.
visibility: hidden veya
opacity: 0 olan elementler, düzen içinde
yer kapladıkları için görünür kabul edilir.
Elementler, belgede yer kaplıyorlarsa görünür
olarak kabul edilir. Görünür elementlerin yükseklik
ve genişlikleri 0'dan farklıdır.
:visible CSS spesifikasyonuna ait olmadığı için,
modern tarayıcılarda performansı artırmak amacıyla
önce saf css seçicisi kullanarak elementleri
filtrelemek, ardından
.filter(':visible') uygulamak daha iyidir.
Elementlerin görünürlüğünü başka yöntemlerle,
örneğin bir sınıf kullanarak takip etmek,
daha iyi performans sağlayabilir.
Sözdizimi
Görünür elementleri şu şekilde seçeriz:
$(':visible');
Örnek
Hadi bir butona tıklayarak görünmeyen kareleri gösterelim. "Görünür" karelere tıklandığında arka planları sarıya dönüşecek:
<button id="show">göster</button>
<div></div>
<div style="display:none;"></div>
<div></div>
<div></div>
<div style="display:none;"></div>
div {
width: 40px;
height: 40px;
margin: 5px;
border: 2px outset green;
float: left;
}
$('div:visible').click(function() {
$(this).css('background', 'yellow');
});
$('#show').click(function() {
$('div:hidden').show('slow');
});
