| Меню сайта |
|
 |
| Реклама |
 |
|
|
 | |  |
|
Бегущая строка
|
|
Бегущая строка
При разработке сайта интересным элементом дизайна, привлекающим внимание, может стать бегущая строка. Особенно удобно размещать с её помощью краткие новости, информацию о скидках, распродажах и т.п. Кроме того, бегущая строка - самый простой способ создания анимации на сайте.
Бегущая строка формируется с помощью тега <marquee>...</marquee> (закрывающий тег обязателен). Первоначально тег <marquee> был предназначен только для браузера Internet Explorer, но современные версии других браузеров также понимают и поддерживают его, хотя он не входит в спецификацию HTML. Из-за этого наличие на странице тега <marquee> приведет к невалидному коду, то есть ошибке при проверке, но её можно (и нужно) игнорировать. Так же следует учитывать, что браузеры по-разному отображают содержимое бегущей строки, так что при создании сайта обязательно проверяйте её вывод. Как всегда, на первом месте по непредсказуемости обработки HTML-кода стоит Internet Explorer, и тег <marquee> для него не исключение.
Для создания сайта особый интерес представляет то, что содержимое контейнера <marquee> не ограничивается простым текстом и позволяет перемещать любые элементы веб-страницы - изображения, текст, таблицы, элементы форм и т.д.
Длину бегущей строки можно ограничить, а так-же задавать нужные ей атрибуты, приведенные ниже.
Перемещение бегущей строки можно задавать не только по горизонтали, но и по вертикали. В этом случае, как и в предыдущем, можно указать размеры области, в которой будет происходить движение (атрибуты width и height тега <marquee> соответственно).
Атрибуты
width — ширина поля бегущей строки в пикселах или процентах от ширины окна;
height — высота поля бегущей строки (в пикселах);
hspace, vspace — интервалы по горизонтали и вертикали между текстом строки и краями ее поля (в пикселах);
aligh —положение текста бегущей строки в ее поле; возможные аргументы:
top (вверху);
bottom (внизу);
middle (посередине);
direction — определяет направление движения; возможные аргументы:
left (справа налево);
right (слева направо);
behavior — характер движения строки; возможные аргументы:
scroll — текст появляется от одного края и скрывается за другим;
slide — строка вытягивается из одного края поля и останавливается у другого края;
alternate — переменное направление движения, от одного края к другому, а затем обратно;
loop — количество повторений текста в бегущей строке, задаваемое числом; если необходимо «бесконечное» количество повторений, то следует задать аргумент в виде ключевого слова infinity.
Атрибут loop не влияет на поведение бегущей строки, если для атрибута behavior заданы аргументы alternate или slide;
scrollamount — устанавливает длину (в пикселах. При большом значении параметра текст движется рывками, при малом — замедленно;
scrolldelay — величина паузы между тактами перемещения текста в миллисекундах;
bgcolor — устанавливает цвет поля бегущей строки, задаваемый шестнадцатеричным числом или именем.
Размещая бегущую строку у себя на сайте, вы делайте сайт более интерактивным и красивым. Следует учитывать, что пренебрежение ее на сайте, в первую очередь, существенно может сказаться на посетителях. Поэтому не стоит злоупотреблять, так как это сказывается и на загрузку Web-страницы. Бегущая строка может быть как текстовой, так и графической. Ниже приведен один из самых простых ее примеров. Об остальных видах и графики чуть позже.
Пример:
<marquee width="470" height="17" direction="left" scrollamount="2"
bgcolor="#F9F9F9"
style="color:#000000; border:1px solid #dddddd">
Вот так выглядит бегущая строка!</marquee>
Результат:
Другие примеры Бегущей строки
|
|
|
|
|
| |
 | |  |
|
| Заработай сейчас! |
 |
|
| Навигация по сайту |
|
|
| Поиск по сайту |
|
|
|
