Selektor visible

Selektor :visible izbere vse vidne elemente na strani. Elementi z visibility: hidden ali z opacity: 0 se štejejo za vidne, saj zasedajo prostor v postavitvi. Elementi se štejejo za vidne, če zasedajo prostor v dokumentu. Vidni elementi imajo višino in širino različno od 0. Ker :visible ne spada v CSS specifikacijo, je za boljšo zmogljivost v sodobnih brskalnikih bolje najprej filtrirati elemente z uporabo čistega css-selektoria, nato pa uporabiti .filter(':visible'). Sledenje vidnosti elementov z drugimi metodami, na primer z uporabo razreda, lahko zagotovi boljšo zmogljivost.

Sintaksa

Tako izberemo vidne elemente:

javascript$(':visible');

Primer

Ob kliku na gumb pokažimo nevidne kvadrate. Ob pritisku na "vidne" kvadrate se bo njihova ozadje spremenilo v rumeno:

html<button id="show">show</button>
<div></div>
<div style="display:none;"></div>
<div></div>
<div></div>
<div style="display:none;"></div>

cssdiv {
  width: 40px;
  height: 40px;
  margin: 5px;
  border: 2px outset green;
  float: left;
}

javascript$('div:visible').click(function() {
  $(this).css('background', 'yellow');
});

$('#show').click(function() {
  $('div:hidden').show('slow');
});

Glej tudi