Книги-online
a {color:darkred;text-decoration:underline;}
a.doc {color:#003366;text-decoration:underline;}
td {font-size:10pt;}
.example {margin-left:10px;color:darkred;font-family:monospace;font-size:10pt;text-align:left}
current=0;
next=0;
function change()
{
next=current+1;
if(next>4) next=0;
window.document.all.item("kuku",current).style.visibility="hidden";
window.document.all.item("kuku",next).style.visibility="visible";
current=next;
}
Каскадные Таблицы Стилей. Учебник. Cascading Style Sheets ( CSS ). Guide.
Одним из наиболее интересных атрибутов CSS-P является атрибут visibility. Он позволяет "проявлять" или прятать информацию на HTML-странице.
Например, эта страница - набор кадров, которые можно перелистывать. Для этого просто нужно нажимать на слово "далее" в конце этой страницы.
Перелистывание реализовано как изменение атрибута visibility в JavaScript-функции:
function change()
{
next=current+1;
if(next>1) next=0;
window.document.all.item("kuku",current).visibility="hidden";
window.document.all.item("kuku",next).visibility="visible";
current=next;
}
Последовательность "kuku" - это значение атрибута id раздела.
Вызов функции при этом помещен в гипертекстовую ссылку со схемой URL "javascript":
<a href="books-page-html-css3-javascript:change();void(0);">
далее...
</a>
На предыдущих фрагментах этой страницы мы обсудили программирование visibility, но ни словом не упомянули о том, как этот атрибут записывается в CSS. Здесь мы восполняем этот пробел и приводим описание невидимого раздела:
<div id=kuku style="position:absolute;
top:230px;left:55px;width:550px;
visibility:hidden;">...</div>
При программировании атрибута visibility следует принимать в расчет тип браузера. Данная страница написана для Microsoft Internet Explorer. Это следует и из программного кода, который поддерживает DHTML объектную модель документа и из использования атрибута id у раздела. Для Netscape Navigator нами разработана другая страница.
