Селектор visible

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

Синтакса

Овако бирамо видљиве елементе:

javascript$(':visible');

Пример

Хајде да на клик на дугме прикажемо невидљиве квадратиће. При притиску на "видљиве" квадратиће њихова позадина ће се мењати у жуту:

html<button id="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');
});

Погледајте такође