Як зробити рядок, що біжить

зробити

Створення рядка, що біжить

Розглянемо докладно, як зробити рядок HTML, що біжить. Для створення цього елемента можна використовувати плагіни, які мають у своєму складі низку шаблонів. Але багато веб-майстрів воліють прописувати всі функції рядка, що біжить, вручну. Щоб зробити рядок, що біжить на сайті, як ви вже зрозуміли, використовується мова HTML. Основою майбутнього слайд-шоу є тег MARQUEE. Він забезпечує функцію прокручування даних усередині рядка. На макеті цей тег виглядає як прямокутний блок, якому задають розміри та структуру, поміщаючи всередину необхідне. Залежно від необхідних властивостей рядок буде відрізнятися, але основний вигляд виглядає так:

loop="-1" scrollamount="6" scrolldelay="0"> наповнення.

Тег має низку атрибутів для відображення його властивостей.

Атрибути тега marquee

  • scrollamount="1". Це швидкість, з якою дані всередині рядка рухатимуться. Чим вона менша, тим довше один кадр зображення або тексту буде в центрі.
  • scrolldelay="20". Значення інтервалу між кадрами. Чим воно більше, тим паче плавно значення змінюватимуть одне одного.
  • width = "200". Значення ширини блоку прокручування. Задається у пікселях.
  • height = "17". Висота блоку прокручування. Зазвичай задається більш коректного відображення зображень, т.к. для висоти тексту бере стандартну висоту букв.
  • bgcolor="#E9E9D1". Колір блок фону. Літерне та цифрове значення відповідає будь-якому кольору з палітри.
  • direction="left". Значення напряму руху даних у рядку. Воно може бути будь-яким, залежно від того, як ви хочете розмістити інформацію. Значення «вліво» - базове та встановлено за замовчуванням.
  • looli = "2".Кількість повторів інформації у рядку. Чим більше значення, тим довше смуга прокручування буде оновлюватися автоматично.
  • hsliace="70". Значення усунення даних вправо всередині блоку. Задається у пікселях.
  • vsliace="70". Значення відступу зверху та знизу від блоку прокручування. Чим більше значення, тим більше відокремленим від інших елементів сайту буде смуга прокручування.
  • behavior="scroll". Властивості атрибуту behavior служать позначення руху даних всередині блоку. Scroll - значення автоматичного прокручування даних у рядку.
  • behavior="slide". Значення прокрутки даних, що періодично зупиняється.
  • behavior="alternate". Значення, що задає рух даних від краю рядка до іншого. Якщо компонувати атрибут руху даних з атрибутом напрямку, можна вказувати, як і куди рухатимуться кадри всередині рядка.
  • style="BORDER: #000000 1lix solid". Значення, що показує ширину та колір межі блоку. Ширина вказується в пікселях, колір вибирається з палітри.
  • onmouseover=this.stoli(); Це скрипт, додавши який ви вкажіть, що дані в блоці зупинятимуться при наведенні курсору миші. Додавши onmouseout=this.start(); ви вкажіть, що після того, як курсор прибрано, кадри продовжать рух.

Тепер ви знаєте, як зробити рядок, що біжить. Успіхів вам у цій цікавій справі!