Главная » Файлы » Прочие скрипты » jQuery |
Придаём реалистичность прокрутке текста для HTML тега < marquee > на jQuery
23.06.14, 11:31:43 | |
Интересный плагин, который позволяет оживить прокрутку текста, осуществляемую через тег marquee Для начала посмотрите ДЕМО (Сверху - обработка через jQuery, снизу - без обработки) Установка: После /head на нужных страницах вставляйте: Код <script src="/js/jquery.marquee.js" type="text/javascript"></script> <script type="text/javascript"> <!-- $(function () { $('.demo marquee').marquee('pointer').mouseover(function () { $(this).trigger('stop'); }).mouseout(function () { $(this).trigger('start'); }).mousemove(function (event) { if ($(this).data('drag') == true) { this.scrollLeft = $(this).data('scrollX') + ($(this).data('x') - event.clientX); } }).mousedown(function (event) { $(this).data('drag', true).data('x', event.clientX).data('scrollX', this.scrollLeft); }).mouseup(function () { $(this).data('drag', false); }); }); //--> </script> Для того, чтобы текст в тегах marquee начал обрабатываться, достаточно обрамить их в div'ы с классом demo: Код <div class="demo"> <marquee behavior="scroll" direction="left" scrollamount="2" width="350"> Здесь текст, который движется справа налево</p></marquee> <marquee scrollamount="2" behavior="alternate" direction="right" width="350"> Здесь текст, который движется то вправо, то влево</p></marquee> <marquee loop="3" behavior="slide" direction="right" width="350"> Здесь текст, который можно двигать курсором мышки</p></marquee> <marquee behavior="scroll" direction="down" scrollamount="2" height="100" width="350"> Здесь текст, который движется сверху вниз</p></marquee> </div> Остаётся лишь залить скрипт из прикреплённого архива в папку js Материал подготовлен Apocalypse | |
Просмотров: 336 | Загрузок: 0 | |
Всего комментариев: 0 | |
| |