Селектор visible
Селектор :visible ги избира сите видливи
елементи на страницата.
Елементите со visibility: hidden или со
opacity: 0 се сметаат за видливи, бидејќи заземаат
простор во распоредот.
Елементите се сметаат за видливи ако заземаат
простор во документот. Видливите елементи имаат висина
и ширина различни од 0.
Бидејќи :visible не припаѓа на CSS спецификацијата,
за подобрување на перформансите во современи
прелистувачи подобро е прво да се филтрираат елементите со
користење на чист css-селектор, а потоа
да се примени .filter(':visible').
Следењето на видливоста на елементите со други
методи, на пример, со класа, може
да обезбеди подобри перформанси.
Синтакса
Вака ги избираме видливите елементи:
$(':visible');
Пример
Ајде при клик на копчето да ги прикажеме невидливите квадратчиња. При притискање на "видливите" квадратчиња нивната позадина ќе се менува на жолта:
<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');
});