Иногда, нам необходимо скрыть от глаз простого смертного (пользователя) или показать ему определенные элементы на странице. Для этого можно воспользоваться такими свойствами элементов как visibility и display.
Вот пример страницы, где Ссылка 1 скрывает Ссылку 2, а Ссылка 3 наоборот показывает.
<html>
<head>
<title>Untitled</title>
<script type=text/javascript language=JavaScript>
<!--
function q3_onclick()
{
//document.getElementById('q2').style.visibility='visible';
document.getElementById('q2').style.display='';
}
function q1_onclick()
{
//document.getElementById('q2').style.visibility='hidden';
document.getElementById('q2').style.display='none';
}
//-->
</script>
</head>
<body>
<a id=q1 href=# onClick=q1_onclick()>Ссылка 1</a>
<a id=q2 href=#>Ссылка 2</a>
<a id=q3 href=# onClick=q3_onclick()>Ссылка 3</a>
</body>
</html>
Различие между visibility и display заключается в том, что visibility делает элемент невидимым, но оставляет на его месте пустоту размером с данный элемент. Display - полностью прячет элемент, со сдвигом всех остальных элементов на его место.
Комментарии