www.wmaster.ru
Wmaster.ru

На главную

Введение в дизайн

СТАТЬИ

Хостинг

DOCS

Коллекция шрифтов

Скрипты

Секреты мастеров

Продвижение сайта

Soft

Журнал Wmaster

Электронные журналы

ФоруМ

web-mastering
HTML
Programming
HTML-редакторы
Учебник по SEO
Apache
MySQL
XML/WML
Flash
Photoshop
.htaccess
Всё для форумов
Clipart
3DSMax
SSI
CSS
Технология раскрутки
Авторское право
Кодовые таблицы
Важное

Windows

Кое-что о расслоении
Каждый настоящий дизайнер знает, что для создания классной композиции не обойтись без использования слоев. С появлением браузера Netscape Communicator 4, технологию слев можно применять непосредственно для оформления Web-страниц. Слой - это HTML-контейнер (тег LAYER, DIV или SPAN), в который можно помещать желаемое содержимое для последующего точного позиционирования на странице. Слоям можно задавать абсолютные координаты, относительную глубину, фон и т.д. Атрибуты слоя можно изменять с помощью JavaScript. Можно, например, нарисовать несколько картинок, представляющих кадры анимации, расположить их на разных слоях и затем, поочередно изменяя атрибут видимости, показывать поочередно картинки зрителю, создавая эффект анимации. Для перемещения картинки по экрану можно просто менять позицию слоя, на котором она расположена.

Я же хотел сказать о другом. Как известно, браузер InternetExplorer не поддерживают тег <LAYER> ни в 3-ей, ни в 4-ой версии, что фактически лишает всякого смысла применение этого тега и Java-скриптов в сочетании с ним, т. к. доля пользователей Netscape неуклонно снижается. Однако, если нужно добиться совместимости... В HTML есть ''законный" аналог тега <LAYER> - элемент <DIV>. Вот так будет выглядеть конструкция, совместимая с обоими браузерами:

<HTML>
<BODY>
<LAYER ...><!-- открытие слоя в NN -->
<NOLAYER>
<DIV ...><!-- открытие слоя в IE --> 
</NOLAYER>
Содержимое слоя
<NOLAYER>
</DIV><!-- закрытие слоя в IE -->
</NOLAYER>
</LAYER><!-- закрытие слоя в NN -->
</BODY>
<HTML>

Ниже приведен пример кроссбраузерного HTML-кода

<html>
<body>
<layer name=MyLayer bgcolor="white" top=50 left=50
OnMouseOver="colorlayer('red')"
 OnMouseOut="colorlayer('white')">
<nolayer>
<div id=MyDiv style="position:absolute; 
top:50; left:50">
</nolayer>
<p><font size="96">Dynamic Layer</font></p>
<nolayer>
</div>
</nolayer>
<script language=JavaScript1.2>
function colorlayer(changeto)
{ bgColor=changeto }
</script>
</layer>
<script language=VBSCRIPT>
Sub MyDiv_onmouseover()
document.all.MyDiv.style.backgroundColor="red"
End Sub
Sub MyDiv_onmouseout()
document.all.MyDiv.style.backgroundColor="white"
End Sub
</script>
</body>
</html>

Параметры тега <LAYER>

bacground="anyimage.gif" фон слоя
height="100" width="100" ширина и высота области
ID=MyLayer1 идентификатор (имя) слоя
clip="10,10,50,50" координаты границ
top=20 left=100 сдвиг слоя относительно верхнего левого угла страницы

 

Комментарий читателя

Незачем вообще применять тэг <LAYER> - достаточно определить слой с помощью CSS-позиционирования даже для тэга <TABLE>, хотя лучше всего для этого подходят <DIV> или <SPAN>. Нетшкаф понимает это, хотя и с некоторыми ограничениями. Например, он проигнорирует установки размера шрифта для данного слоя или эффект и цвет рамки слоя.


Все заметки: 1 2 3 4 5 6 7 8 9 11 12 оглавление

Партнеры Wmaster
Protoplex.RU
Эскизы татуировок
Поиск по сайту
Объявления
Twitter автора
Карта сайта
Наши баннеры
О проекте

Реклама
(понижение цен)

Об Авторе
Команда
Архив рассылки
 Запомнить эту страницу
Сделать стартовой
Рассылка
Wmaster.ru - всё для вебмастера.
Наша кнопка

Все желающие могут поставить нашу кнопочку к себе на сайт
Всё для веб-мастеров

Партнеры
Бочкарёв Антон
Mail: webmaster[at]wmaster.ru
ICQ: 148780826
Хостинг от Valuehost
© RUscripts.design 2003

© Wmaster Design Group 2001-2008. © Все права защищены. При перепечатке любого материала с сайта  ссылка на http://www.wmaster.ru/  обязательна.