Отображение и скрытие элементов в IE и NN
До выхода рекомендаций CSS-P от W3C, компания Netscape предложила передовую
(по тем временам) технолиогию слоев (layers). Тогда были реализованы некоторые
принципы динамического HTML. Одним из нововведений была возможность скрывать или
показывать уже загруженные слои. С тех пор вышли несколько редакций вышеупомянутых
рекомендаций, Netscape отказалась (почти) от идеи слоев, но головы девелоперов
из Netscape до сих пор забиты пережитками прошлого. Вот и приходится девелоперам
из России (и не только) ломать голову над тем, как елку с яблоками.
Если вы читали мои "опыты" (этот, этот и этот), посвященные скрещиванию,
ты должны были уловить основной принцип построения функций, которые работают независимо
от того, чем (каким браузером) они вызываются. На начальной стадии мы определяем
в каком браузере загружена страничка, а потом, на основании полученных данных,
выполняем тот или иной код. Напомню, что для определения типа браузера и выполнения
некоторых функций, я использую библиотеку detect.js, собственного
написания. Подключив ее на свои страницы, вы получаете в свое распоряжение две
основых переменных, которые затем можно использовать, как определители типа браузера:
NN (Netscape Nvigator) и IE (Internet Explorer).
Перейдем непосредственно к рассматриваемой теме. Для задания "видимости" объектов
используется один и тот же атрибут стиля: visibility. Но значения, которые ему
необходимо присваивать отличаются. Для NN это show (объект
отображается) и hide - нет. Для IE (и, как указано в рекомендациях
W3C) - visible и hidden соответственно.
Также необходимо помнить, что доступ к атрибутам стиля (см. соответствующий опыт) мы используем различную
технику.
Таким образом процедуры могут выглядеть следующим образом:
function show(el) {
if (NN) {
document.layers[el].visibility = "show";
}
else {
document.all[el].style.visibility = "visible";
}
}
function hide(el) {
if (NN) {
document.layers[el].visibility = "hide";
}
else {
document.all[el].style.visibility = "hidden";
}
}
|
Посмотрите пример: show-hide.html
Данные функции добавлены в библиотеку detect.js, описание к которой
успешно перекочевало в раздел "Полезное", где вы всегда
сможете скачать последнюю версию этой библиотеки и почитать описание к ней.
Информация
взята с сайта "Опыты"