Главная
К библиотеке

"Видимость" для 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, описание к которой успешно перекочевало в раздел "Полезное", где вы всегда сможете скачать последнюю версию этой библиотеки и почитать описание к ней.