HTML - статьи

         

Функции, зависящие от браузера


Для получения полностью кросс-браузерного сайта нежелательно использовать браузеро-зависимые возможности, но в качестве украшения или расширения базового функционала это вполне допустимо. Особенно если есть возможность сделать то же самое общедоступными средствами или через аналогичные функции другого браузера.

Для демонстрации всего вышесказанного очень нагляден IE. Microsoft предпочитает внедрять в свой браузер собственные «стандарты». На сайте http://msdn.microsoft.com/

существует большая библиотека, где можно найти информацию по этому поводу.

С одной стороны, использование таких «наворотов», как A ctiveX-компоненты в IE , представляются Web-разработчикам настолько соблазнительным, что от них порой не в силах отказаться самый стойкий программист. С другой стороны, использование этих возможностей означает, что они будут работать только в IE — пользователи других браузеров либо не смогут полностью увидеть такую страницу, либо она вообще не отобразится.

Многим веб-разработчикам очень нравятся фильтры, которые MS предоставляет в своём браузере. Существуют разные типы таких фильтров. Некоторые из них способны создать прозрачность блока, некоторые — градиентную заливку. Приведём пример последней:

<div style="height: 100%; width: 100%; text-align: center; filter:progid:DXImageTransform.Microsoft.Gradient(gradientType=0, startColorStr =#000000, endColorStr =# ffffff);"> <h1 style="color: white;"> Градиент на заднем плане будет работать только в IE. </h1> </div>

Если запустить этот пример в IE , можно будет увидеть блок размерами с окно браузера, фон которого — градиентная заливка. Обычными средствами такой трюк можно сделать либо с использованием нескольких блоков меняющих свой цвет с определённой последовательностью, либо с помощью заранее нарисованной картинки. Покажем, как это можно сделать с помощью JavaScript . Мы сгенерируем серию блоков различной цветовой окраски (меняющейся от чёрного до белого цвета):

<script type="text/javascript"><!--//--><![CDATA[//><!-- function leftPad(x) { return (x.length < 2) ? "0"+x : x; } function hex(x) { return leftPad(x.toString(0x10).toUpperCase()); } for (i=0; i<256; i++) { var color = "#"+hex(i)+hex(i)+hex(i); document.write("<div style='background: "+color+"; font-size: 0; height: 2px; width: 100%; line-height: 0;'><!--//--></div>"); } //--><!]]></ script >

Это вариант сложнее, но он будет работать не только в IE .

Как вы видите, можно пойти простым путём и писать сайты под один единственный браузер — IE , а можно выбрать сложный путь кросс-браузерности. При этом необходимо следовать стандартам, которые понимаются большинством пользовательских агентов.



Содержание раздела