Селектор visible

Селектор :visible ги избира сите видливи елементи на страницата. Елементите со visibility: hidden или со opacity: 0 се сметаат за видливи, бидејќи заземаат простор во распоредот. Елементите се сметаат за видливи ако заземаат простор во документот. Видливите елементи имаат висина и ширина различни од 0. Бидејќи :visible не припаѓа на CSS спецификацијата, за подобрување на перформансите во современи прелистувачи подобро е прво да се филтрираат елементите со користење на чист css-селектор, а потоа да се примени .filter(':visible'). Следењето на видливоста на елементите со други методи, на пример, со класа, може да обезбеди подобри перформанси.

Синтакса

Вака ги избираме видливите елементи:

javascript$(':visible');

Пример

Ајде при клик на копчето да ги прикажеме невидливите квадратчиња. При притискање на "видливите" квадратчиња нивната позадина ќе се менува на жолта:

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');
});

Погледнете ги и