CSS beschrijving eigenschap visibility


Handleiding HTML Legenda | Voorbeelden | CSS eigenschappen | Begin


visibility


CSS 2
IE 4.0
NN 4.0
MOZ 1.0
FF 1.0
OP 4.0
De visibility eigenschap bepaalt of een element wel of niet zichtbaar is.

Waarden: visible | hidden | collapse | inherit
Beginwaarde: visible
Heeft betrekking op: alle elementen
Wordt geërfd: ja
Mediagroep(en): visual

Het gebruik van de visibility eigenschap heeft niet zoveel nut, als een document statisch en compleet moet worden weergegeven. De eigenschap wordt daarom vooral toegepast als delen van de inhoud van een document (bijvoorbeeld afhankelijk van een keuze van de bezoeker) de ene keer wel en de andere keer niet zichtbaar moeten zijn. In dat geval zal een script nodig zijn, om de stijl dynamisch te wijzigen van zichtbaar naar verborgen of omgekeerd.

Voorbeeld:

visibility: collapse
visible
CSS: 2 IE: 4.0 NN: 4.0 MOZ: 1.0 FF: 1.0 OP: 4.0

Het element is normaal zichtbaar.
hidden
CSS: 2 IE: 4.0 NN: 4.0 MOZ: 1.0 FF: 1.0 OP: 4.0

De complete box van het element (de inhoud, de rand en de achtergrond) is transparant. Anders dan bij de display eigenschap met de waarde none behoudt het element de ruimte die het normaal inneemt en ook andere effecten op de lay-out blijven behouden. Het element is er dus wel, alleen zie je het niet.
Een nakomeling (descendent) van een transparant element kun je zichtbaar maken door er de visibility eigenschap voor te gebruiken met de waarde visible.
collapse
CSS: 2 IE: - NN: 6.0 MOZ: 1.0 FF: 1.0 OP: -

De waarde collapse is specifiek bedoeld voor tabellen en kan gebruikt worden om rijen, rijgroepen, kolommen, of kolomgroepen te verbergen. Wanneer je de waarde gebruikt voor de elementen COL, COLGROUP, TR, THEAD, TBODY en TFOOT, dan wordt (anders dan bij waarde hidden) de inhoud niet transparant, maar vervalt de complete ruimte die het element normaal inneemt. Het resultaat lijkt daardoor erg op dat van de display eigenschap met de waarde none. Het grote verschil is echter dat met visibility: collapse eventuele effecten van de verborgen kolom(men) of rij(en) op de lay-out van de tabel behouden blijven.
Wanneer de waarde gebruikt wordt voor andere elementen dan COL, COLGROUP, TR, THEAD, TBODY en TFOOT, dan heeft de waarde dezelfde betekenis als hidden. Dat geldt uiteraard alleen in browsers die de waarde collapse kennen. In andere browsers zal de visibility eigenschap met de waarde collapse genegeerd worden en zal de beginwaarde visible worden aangehouden (tenzij de waarde hidden van een ancestor element wordt geërfd).
De mogelijkheden van de collapse eigenschap worden toegelicht in het onderdeel Verbergen kolommen en rijen.
inherit
CSS: 2 IE: 4.0 NN: 6.0 MOZ: 1.0 FF: 1.0 OP: 4.0

De waarde van het parent element wordt aangehouden.


Bijzonderheden ondersteuning

Microsoft Internet Explorer 4.0
- De waarde visible kan niet gebruikt worden voor het zichtbaar maken van een nakomeling van een element waarvoor visibility: hidden geldt.
- De eigenschap wordt niet ondersteund voor het OPTION element.
- Hoewel de waarde hidden geen betrekking heeft op kolommen, wordt deze toch ondersteund voor de elementen COL en COLGROUP.
Microsoft Internet Explorer 5.0 en hoger
- De eigenschap wordt niet ondersteund voor het OPTION element.
- Hoewel de waarde hidden geen betrekking heeft op kolommen, wordt deze toch ondersteund voor de elementen COL en COLGROUP.
Netscape Navigator 4
- De eigenschap wordt alleen ondersteund voor elementen, waarvoor de position eigenschap is opgenomen met de waarde absolute of relative.
- De eigenschap wordt niet ondersteund voor de elementen DD, DT, LI, IMG, TABLE en niet voor de verschillende elementen die gebruikt worden in formulieren.
Netscape Navigator 6.0
- De waarde collapse wordt bij de elementen INPUT (tekstvelden) en TEXTAREA niet behandeld als hidden. Het element is wel verborgen, maar de effecten op de lay-out blijven niet behouden.
- In een tabel met gescheiden tabelranden blijft bij de waarde collapse de ruimte tussen de randen zowel boven als beneden verborgen rijen zichtbaar.
Netscape Navigator 6.1/6.2
- De waarde collapse wordt bij de elementen INPUT (tekstvelden) en TEXTAREA niet behandeld als hidden. Het element is wel verborgen, maar de effecten op de lay-out blijven niet behouden.
- Wanneer de waarde collapse wordt gebruikt om rijen of kolommen te verbergen, is alleen de inhoud van de cellen verborgen en blijven de randen zichtbaar. De inhoud van de cellen van volgende rijen en kolommen blijft op de oorspronkelijke plek staan.
Netscape Navigator 7.0 en hoger  |  Mozilla 1.0 t/m 1.3
- De waarde collapse wordt bij de elementen INPUT (tekstvelden) en TEXTAREA niet behandeld als hidden. Het element is wel verborgen, maar de effecten op de lay-out blijven niet of niet geheel behouden.
- Als de waarde collapse is gebruikt voor de elementen TR, TBODY, TFOOT of THEAD, dan worden de betreffende rijen alleen verborgen als het document waarin de tabel is opgenomen meer ruimte nodig heeft dan in het venster of frame past (en dus een verticale schuifbalk wordt weergegeven). Als het document wel geheel in het venster of frame past (en dus geen verticale schuifbalk wordt weergegeven), dan is de weergave als bij de waarde hidden.
- Als de waarde collapse is gebruikt voor de elementen COL of COLGROUP, dan worden de betreffende kolommen alleen verborgen als het document waarin de tabel is opgenomen meer ruimte nodig heeft dan in het venster of frame past (en dus een verticale schuifbalk wordt weergegeven). Als het document wel geheel in het venster of frame past (en dus geen verticale schuifbalk wordt weergegeven), dan heeft de waarde collapse geen effect en worden de kolommen normaal weergegeven.
- Wanneer in een tabel met gescheiden tabelranden de waarde collapse wordt gebruikt wordt om rijen te verbergen, blijft de ruimte tussen de randen zowel boven als beneden verborgen rijen zichtbaar. De tussenruimte krijgt daardoor een dubbele hoogte.
- Wanneer in een tabel met samenvallende tabelranden de waarde collapse gebruikt wordt om kolommen te verbergen, is alleen de inhoud van de cellen verborgen en blijven de randen zichtbaar. De inhoud van eventuele volgende zichtbare kolommen schuift daarbij naar links en neemt de plaats in van de verborgen kolommen.
Netscape Navigator 7.1 en hoger  |  Mozilla 1.4 en hoger  |  Firefox
- De waarde collapse wordt bij de elementen INPUT (tekstvelden), TEXTAREA en SELECT niet behandeld als hidden. Het element is wel verborgen, maar de effecten op de lay-out blijven niet of niet geheel behouden.
- Als de waarde collapse is gebruikt voor de elementen TR, THEAD, TBODY of TFOOT, dan worden de betreffende rijen alleen verborgen als het document waarin de tabel is opgenomen meer ruimte nodig heeft dan in het venster of frame past (en dus een verticale schuifbalk wordt weergegeven). Als het document wel geheel in het venster of frame past (en dus geen verticale schuifbalk wordt weergegeven), dan is de weergave als bij de waarde hidden.
- Als de waarde collapse is gebruikt voor de elementen COL of COLGROUP, dan worden de betreffende kolommen alleen verborgen als het document waarin de tabel is opgenomen meer ruimte nodig heeft dan in het venster of frame past (en dus een verticale schuifbalk wordt weergegeven). Als het document wel geheel in het venster of frame past (en dus geen verticale schuifbalk wordt weergegeven), dan heeft de waarde collapse geen effect en worden de kolommen normaal weergegeven.
- Wanneer in een tabel met gescheiden tabelranden de waarde collapse wordt gebruikt wordt om rijen te verbergen, blijft de ruimte tussen de randen zowel boven als beneden verborgen rijen zichtbaar. De tussenruimte krijgt daardoor een dubbele hoogte.
- Wanneer in een tabel met samenvallende tabelranden de waarde collapse gebruikt wordt om kolommen te verbergen, is alleen de inhoud van de cellen verborgen en blijven de randen zichtbaar. De inhoud van eventuele volgende zichtbare kolommen schuift daarbij naar links en neemt de plaats in van de verborgen kolommen.
Opera 4.0 t/m 6.0
- De waarde visible kan niet gebruikt worden voor het zichtbaar maken van een nakomeling van een element waarvoor visibility: hidden geldt.
- De eigenschap wordt niet ondersteund voor de elementen TBODY, TFOOT en THEAD.
- De waarde collapse wordt niet op de bedoelde wijze ondersteund, maar (ook voor de elementen waarmee rijen en kolommen in tabellen zijn opgebouwd) als hidden geïnterpreteerd.
Opera 7.0 t/m 7.2
- De waarde visible kan niet gebruikt worden voor het zichtbaar maken van een nakomeling van een element waarvoor visibility: hidden geldt.
- De waarde collapse wordt niet op de bedoelde wijze ondersteund, maar (ook voor de elementen waarmee rijen en kolommen in tabellen zijn opgebouwd) als hidden geïnterpreteerd.
Opera 7.5 en hoger
- De waarde collapse wordt niet op de bedoelde wijze ondersteund, maar (ook voor de elementen waarmee rijen en kolommen in tabellen zijn opgebouwd) als hidden geïnterpreteerd.



Legenda | Voorbeelden | CSS eigenschappen | Begin

Handleiding HTML (https://www.handleidinghtml.nl/)
Copyright © 1995-2021 Hans de Jong
Laatste wijziging: 5 december 2004