Как сделать бегущую строку на HTML?

Как сделать бегущую строку на HTML?

Для добавления на веб-страницу бегущей строки необязательно использовать скрипты, апплеты и тому подобное. Можно воспользоваться средством языка HTML – тегом marquee. Правда, проходить проверку на соблюдение веб-стандартов страница после этого уже не будет.

Инструкция

Уровень сложности: Легко

1 шаг

Как сделать бегущую строку на HTML?

Простейшую бегущую строку вы получите, поместив текст желаемой длины (в одну строку) между тегами <marquee> и </marquee>. Типа этого:
<marquee> Ползёт по экрану бегущая строка, смотрите, какая красивая!</marque>
И всем она будет хороша, кроме одного. Ползёт слишком быстро, читать не успеваешь! Наверняка вы замечали нечто подобное и на электронных бегущих строках, которые сегодня повсюду. На некоторых из них текст не ползёт, а несётся аллюром. Вот уж действительно, не простая строка, а бегущая! Надо бы её замедлить.

2 шаг

Как сделать бегущую строку на HTML?

Что ж, замедлим. С закрывающим тегом делать ничего не надо, как и с любыми другими закрывающими тегами в HTML. Оставим его как есть. “Пошаманить” придётся с открывающим, добавив в него желаемые параметры. Первый из них – scrollamount. Ну-ка, добавим его в открывающий тег:
<marquee scrollamount=1>
Что, строка поползла медленнее? А это потому что ранее при каждом шаге строка сдвигалась сразу на 6 пикселей (таково значение этого параметра по умолчанию, когда он не задан), а теперь – всего на 1. Текст ползёт не только медленно, но и плавно.

3 шаг

Как сделать бегущую строку на HTML?

Можно сделать и по-другому. Не меняя число пикселей, на которое строка сдвигается за один шаг, увеличить паузу между шагами. По умолчанию она равна 85 миллисекундам. Давайте увеличим её, например, до 500, или, что то же самое, до 0,5 секунд, используя параметр scrolldelay:
<marquee scrolldelay=200>
Теперь строка двигается тоже медленно, но рывками – воспользуйтесь этим способом, если вам необходим такой эффект. Не говоря уж о том, что в открывающем теге можно совмещать оба параметра, как scrollamount, так и scrolldelay, если их значения, согласно вашему замыслу, должны отличаться от заданных по умолчанию: соответственно, 6 и 85. Успехов вам в экспериментировании с бегущими строками на своих веб-страницах.

Обсуждение

497_micro
Рейтинг
  1. +
  2. 1
stealh (17:06 06.08.2013)

имхо, все это давно реализовано на скриптах. Зачем парить себе мозги HTML, непонятно. Так можно каждый тег описать, инструкций-то будет…)

695_micro
Рейтинг
  1. +
  2. 0
belkka (23:16 06.08.2013)

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

Ваш комментарий

Запросить инструкцию

Не нашли нужную пошаговую инструкцию?
Возможно, что кто-то из посетителей сайта сможет помочь. Оставьте запрос прямо сейчас, если Вы уверены, что эта тема ещё не освещена на нашем проекте!

Рейтинг
  1. +
  2. 1
2
14