2014-02-10
307
Свойство visibility управляет отображением элемента. По умолчанию (значение inherit) значение свойства наследуется от родительского элемента.
Значение hidden скрывает элемент (делает его невидимым) независимо от видимости родительского элемента, а значение visible, наоборот, задает видимость элемента независимо от видимости родительского элемента.
Поведение элемента со свойством visibility, равным hidden, отличается от поведения объекта со свойством display равным none. В последнем случае элемент не только не отображается, но и изымается из потока отображения, и на странице нет пустого блока, соответствующего этому элементу.
Пример 4.5.61. Использование свойства visibility:
Для тела документа HTML
<button id="eagleButton" onclick="showImage('eagle')">Орел</button>
<button id="eagleButton"
onclick="showImage('baloon')">Воздушный шар</button>
<div id="eagle" style="position:absolute;top: 40px;
left: 20px; border:6px blue ridge; padding:10px;
visibility:hidden">
<img src="images/Eagle.png"/>
</div>
<div id="baloon" style="position:absolute;top: 70px;
left: 60px; border:6px blue ridge;padding:10px;
visibility:hidden">
<img src="images/baloon.png"/>
</div>
вывод Web-страницы будет иметь следующий вид (при загрузке страницы, при нажатии кнопки Орел и при нажатии кнопки Воздушный шар):
| 
| 
|
