სელექტორი 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');
});