Различия в IE и NC
Internet Exploter 6.0 (IE) и Netscape Communicator 4.0 (NC) по
разному интерпретируют HTML 4.0. Поэтому
прежде, чем рассматривать принципы
создания Динамических HTML, рассмотрим
основные отличия этих браузеров и как с
ними бороться.
IE представляет слои с помощью CSS и тэга div,
в то время как NC советует использовать
изобретенный им тэг layer.
Например для IE:
<head>
<style type="text/css">
#loading {POSITION: absolute; TOP:0; LEFT:0; Z-INDEX: 80000; WIDTH: 100%; HEIGHT: 100%;}
</style>
</head>
<body>
<div id="loading">
<table width="100%" height="100%">
<tr><td align="center" valign="middle">
Еще немного и из-за поворота выглянет то, к чему Вы так стремились...
</td></tr>
</table>
</div>
</body>
а для NC:
<body>
<layer name="loading" left="0" top="0" z-index="80000" width="100%" height=100%">
<table width="100%" height="100%">
<tr><td align="center" valign="middle">
Еще немного и из-за поворота выглянет то, к чему Вы так стремились...
</td></tr>
</table>
</layer>
</body>
Тэг layer ничем не отличается от CSS, за
исключением параметра source, с помощью
которого можно указать внешний файл в
котором хранится содержимое слоя. Если Вы
не собираетесь поддерживать IE, лучше
выбрать синтаксис NC. Это позволит строить
сложные документы и не повторять во всех
файлах стандартные слои, такие как
навигационнфя панель или шапка страницы.
На этом проблемы совместимости не
заканчиваются, а только начинаются.
Классы JavaScript в IE и NC также реализованны по
разному. Например, чтобы показать слой в NC
надо сказать
document.layers["loading"].visibility="visible";
а в IE:
document.all["loading"].style.visibility="visible";
Наш урок носит обзорный характер, поэтому
мы не будем подробно рассматривать все
различия реализации языка. Посмотрим
лучше, как решаются эти проблемы.
Как с ними бороться
Слава Netscape, в JavaScript есть пракрасная
функция eval(). Она параметр в строку и
интерпретирует ее так, как-будто это
строка программы. Чтобы корректно
спрятать слой как в IE, так и в NC необходимо
написать следующую строку:
eval(layerRef+'["loading"]'+styleSwitch+'.visibility="visible"');
Теперь все, что остается, это правильно
инициализовать переменные layerRef и styleSwitch с
помощью следующего кода:
var layerRef="null", styleSwitch="null";
function init(){
if (navigator.appName == "Netscape") {
layerRef="document.layers";
styleSwitch="";
}else{
layerRef="document.all";
styleSwitch=".style";
}
}
Вызвав его в тэге body:
<body onload="init();">
<< предыдущая
||
следующая >>
|
|
|
Автор:
Ресурс: infocity.kiev.ua |
|
Статьи веб-мастеру
Новичкам
