Селектар 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');
});
