Блог веб разработки

Блог веб-разработки статьи | видеообзоры | исходный код

marquee html

Всем привет! Сегодня мы рассмотрим тег marquee. Данный тег позволяет перемещать содержимое в определенную сторону.

Пример:

<style>
    li{
        display:inline;
        margin-right:20px;
      
    }
</style>
<marquee >
    <ul>
        <li>Слайд1</li>
        <li>Слайд2</li>
        <li>Слайд3</li>
    </ul>
</marquee>

Здесь мы обернули маркированный список в тег marquee. В результате мы получили такой интересный эффект когда содержимое данного тега перемещается справа налево.

Данный тег поддерживается во многих браузерах в том числе и в IE.

С помощью определенных атрибутов мы можем поведение данного тега.

Например через атрибут direction мы можем указывать направление движения содержимого в теге marquee.

<marquee direction="right" >...</marquee>

Содержимое будет двигаться слева на право. Данный атрибут принимает следующие значения. direction="down | left | right | up". По умолчанию left.

Атрибут scrollamount отвечает за скорость движения, по умолчанию она равна 6.

Атрибут loop - количество повторений полных перемещений, если не указать, то контент внутри тега marquee будет перемещаться неограниченное количество раз.

Далее по списку:

behavior="alternate | scroll | slide" - задает определенный тип движения по умолчанию alternate. Для сравнения можете проверить самостоятельно, отличия есть.

bgcolor - задает цвет фона в теге

width - устанавливает ширину тегу

height - устанавливает высоту тегу

Атрибуты hspace и vspace предназначаются для добавления пустого пространства по краям и высоте содержимого элемента marquee.

Есть еще такой интересный атрибут scrolldelay. В нем мы указываем время задержки в миллисекундах. И чем меньше значение, тем больше скорость перемещения содержимого тега.

На этом данная статья подошла к концу. С помощью тега marquee мы можем делать активные (перемещающиеся)ленты объявлений, новостей, статистики на своем ресурсе. Тем самым привлекая внимание пользователей. Однако сильно увлекаться этим не стоит. Ну, да ладно!

Если у вас появились вопросы оставляйте их в комментариях или в группе

вк

На этом у меня все. Желаю вам успехов и удачи! Пока!

Оцените статью

Еще статьи

let javascript

JS execCommand

hide show JQuery

Переменные окружения PHP

CSS counter-increment

tkinter создание окна

details html

отступ текста css

Комментарии

Проверочный код

В данном разделе пока нет комментариев!

История

    ПОДПИСКА

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

    НОВОСТИ

    • Всем привет! Запустил новый сервис для поиска и бесплатного скачивания, прослушивания аудиокниг. Здесь вы можете найти множество литературы и прослушать ее. Вскоре возобновлю написание статей.