Selektor visible
Selektor :visible bira sve vidljive
elemente na stranici.
Elementi sa visibility: hidden ili sa
opacity: 0 smatraju se vidljivim, jer zauzimaju
mesto u layout-u.
Elementi se smatraju vidljivim ako zauzimaju
mesto u dokumentu. Vidljivi elementi imaju visinu
i širinu različite od 0.
Pošto :visible ne pripada CSS specifikaciji,
za bolju performansu u modernim
browser-ima je bolje prvo filtrirati elemente
koristeći čisti css-selektor, a zatim
primeniti .filter(':visible').
Praćenje vidljivosti elemenata pomoću drugih
metoda, na primer, pomoću klase, može
obezbediti bolje performanse.
Sintaksa
Ovako biramo vidljive elemente:
$(':visible');
Primer
Hajde da klikom na dugme prikažemo nevidljive kvadrate. Kada se klikne na "vidljive" kvadrate njihova pozadina će se promeniti u žutu:
<button id="show">show</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');
});
