Seletor hidden
O seletor :hidden seleciona todos os elementos na
página que estão ocultos.
Elementos com visibility: hidden ou com
opacity: 0 são considerados visíveis, pois ocupam
espaço no layout. Os elementos podem ser considerados invisíveis
por várias razões: o valor da propriedade CSS
display é none, ou são elementos com
o atributo type="hidden",
ou sua altura ou largura estão definidas como 0,
ou o elemento pai está oculto.
Como :hidden não pertence à especificação CSS,
para melhorar o desempenho em navegadores modernos
é melhor filtrar primeiro os elementos com
um seletor CSS puro e depois
aplicar .filter(':hidden').
Acompanhar a visibilidade dos elementos usando outros
métodos, por exemplo, usando uma classe, pode
proporcionar melhor desempenho.
Sintaxe
É assim que selecionamos os elementos ocultos:
$(':hidden');
Exemplo
Vamos mostrar os quadrados invisíveis ao clicar
no botão #test:
<button id="test">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;
}
$('#test').click(function() {
$('div:hidden').show('slow');
});
