Cross-browser
The plugin supports all popular browsers, such as: Opera, Mozilla Firefox, Google Chrome, Internet Explorer, Safari
Touch mobile compatible
All functionality is fully supported on the touch devices
Stop and Start
You can pause Marquee when mouse hover, and play when mouse out
Drag and drop
You can move Marquee by the mouse cursor for a comfortable reading or viewing position
Multidirectional
The movement of the Marquee can be set both horizontally (left, right) and vertical (up and down)
Unlimited type content
The content can be any web page element - a simple text, images, tables, form elements, etc.
It is possible to upload text from an XML file
Dynamic Control
All parameters can be changed dynamically
Window Resize
Supports change of screen sizes
Change Content
The content can be deleted, changed or added dynamically at any time
Page Scroll
Detecting when a marquee is scrolled into view. Outside screen marquee stops. Inside screen marquee starts to move. When the page is scrolled, the line stops
Callback
Almost all of the events have a callback functions
Templates
For the lazy there is a set of predefined templates to suit different tastes
INCLUDE FILES <head> ...[THIS CODE]... </head>
PLUGINS INITIALIZATION <head> ...[THIS CODE]... </head>
Инициализацию можно прописать тоже между <head> и </head> или в отдельном js-файле но уже без тега <script>
HTML ...[THIS CODE]...
OPTIONS
| Option | Default value | Datatype | Description |
|---|---|---|---|
| width | "auto" | String, Number | Sets width of the Marquee. It may take the values: any positive number or "auto" |
| height | "auto" | String, Number | Sets height of the Marquee. It may take the values: any positive number or "auto" |
| direction | "left" | String | Sets the direction of the Marquee It may take the values: "left", "right", "up", "down" |
| scrollDelay | 85 | Number | Sets the interval between each scroll movement in milliseconds It may take the values: any positive number |
| scrollAmount | 6 | Number | Sets the amount of scrolling at each interval in pixels It may take the values: any positive number |
| circular | false | Boolean | Creates the effect of an infinite line. It may take the values: true, false |
| dragAndDrop | true | Boolean | Enable the opportunity to drag the Marquee by the mouse It may take the values: true, false |
| hoverStop | true | Boolean | Enable the opportunity to pause the Marquee when mouse hover It may take the values: true, false |
| scrollStop | true | Boolean | Enable the opportunity to pause the Marquee when scroll page It may take the values: true, false |
| startShow | false | Boolean | If it is true - the content of marquee appears immediately if the lie - gradually It may take the values: true, false |
| xml | false | Boolean, String | Path to XML file. Imports an external XML file with content, and downloads the content in Marquee. It may take the values: XML file path or false |
| removeContentFadeDuration | 300 | number |
The duration of fading when removing the content of marquee in ms It may take the values: any positive number |
METHODS
getContent() |
Returns the actual content of the Marquee This method does not accept any arguments $('.str').liMarquee('getContent'); |
|
addContent(string)
|
Adds to marquee the new content
string
Type: stringThe new content. $('.str').liMarquee('addContent','New Content'); |
removeContent() |
Remove from marquee all content This method does not accept any arguments $('.str').liMarquee('removeContent'); |
changeOptions(options) |
Restarts line with the new settings
options
Type: objectThe new options. $('.str').liMarquee('changeOptions',{direction:'right',circular:false}); |
destroy() |
Removes all the functionality of Marquee. It returns the element in the condition before the initialization of the plug-in This method does not accept any arguments $('.str').liMarquee('destroy'); |
stop() |
Stop movement Marquee This method does not accept any arguments This method does not accept any arguments $('.str').liMarquee('stop'); |
start(delay) |
Start movement Marquee
options
Type: NumberThe delay before starting the animation, ms. Default Value: 0 $('.str').liMarquee('start', 300); |
resetPosition() |
Reset start end end position of marquee Animation This method does not accept any arguments $('.str').liMarquee('start'); |
EVENTS
create() |
Triggered when the liMarquee is created
$('.str').liMarquee({ |
moveStart() |
Triggered when motion starts
$('.str').liMarquee({ |
moveStop() |
Triggered when motion stops
$('.str').liMarquee({ |
drag() |
Triggered while the string is moved during the dragging
$('.str').liMarquee({ |
dragStart() |
Triggered when dragging starts
$('.str').liMarquee({ |
dragStop() |
Triggered when dragging stops
$('.str').liMarquee({ |
Change Log
v.5.0- 10/10/2015 Optimized code (14KB to 10KB)
- 12/10/2015 Added touch events for Mobile devices
- 13/10/2015 Added new Options: width, height, scrollDelay, scrollAmount, scrollStop, startShow, removeContentFadeDuration
- 14/10/2015 Added new methods: getContent, addContent, removeContent, changeOptions, resetPosition
- 15/10/2015 Added new Events: create, moveStart, moveStop, drag, dragStart, dragStop
v.4.8
- 03/10/2015 Changed Event of Pause
- 04/10/2015 Added New Templates
v.4.7
- 28/09/2015 - Fixed the starting position of a long string v.4.6
- 11/20/2014 Added methods & quot; pause & quot; and & quot; play & quot; to pause / start traffic line
- 10/30/2014 Added the ability to dynamically change the speed of the line (see demo: & quot; Change speed & quot;)
- 04/27/2014 Added method & quot; destroy & quot ;, which removes all the functionality running line item and returns to the state before initializing plug
- 03/30/2014 Posted cycling short line when you drag
- 03/30/2014 Fixed bug positioning long line when you drag
v.4.5
- 03/23/2014 Added lock random event & quot; click & quot;
v.4.4
- 02/09/2014 Added parameter & quot; inverthover & quot ;, which inverts the standard response to hovering over.
- 02/09/2014 Ipravlen bug when dragging a looped line
v.4.3
- 01/21/2014 Fixed speed calculation using the method & quot; update & quot;
v.4.2
- 04/12/2013 Added method & quot; update & quot ;, which updates the initialization string after changing the internal content
v.4.1
- 02/12/2013 Added the ability to load an XML file multi
v.4.0
- 11/22/2013 Added parameter & quot; hoverstop & quot ;. If the value is & quot; true & quot; - The line stops when the mouse (the default), & quot; false & quot; - The line does not stop
- 11/22/2013 Movement short line from right to left and top to bottom now starts correctly (movement starts from the opposite end of the line)
v.3.3
- 10.12.2013 Added ability to dynamically changing traffic line
v.3.2
- 07/09/2013 Added the ability to drag and drop a line image
- 07/09/2013 Fixed a bug when you drag the line (when the mouse while holding LM went beyond the line)
- 06/09/2013 Added the example of HTML blocks
v.3.1
- 30.07.2013 Added horizontal movement the right direction: 'right'
v.3.0
- 05/24/2013 Posted movement vertically downward direction: 'down'
- 05/17/2013 Added ability podgruzki text from xml file
v.2.0
- 20.02.2013 Fixed bug in a continuous line, which led to an unexpected acceleration ticker
- 01/26/2013 Added the possibility of motion-controlled short-line (option: & quot; runshort & quot ;, values: & quot; true & quot; or & quot; false & quot;)
- 22.01.2013 ?2 - Fix for slow internet. In HTML, the recommended element immediately build upon the class of & quot; str_wrap & quot ;. The file itself liMarquee.css for it was little changed
- 22.01.2013 ?1 - Fix for IE9. With version jQuery 1.8 does not function $ (window) .load () - This bug is addressed in version 1.9.0, so the script is included, along with jquery version 1.9.0
Комментарии
Но подскажите один нюанс. Сейчас имеется не очень приятный недочет. Заключается в том, что оформление строки подгружается только после окончательной загрузки сайта. Выглядит в итоге не очень красиво на более тяжелых сайтах. Может быть имеется какое либо решение?
Буду благодарен за ответ и по возможности, за решение проблемки.
С уважением, SiTiS
Спасибо за уважение.
22.01.2013 №2 - Фикс под медленный интернет. В HTML рекомендовано элементу сразу дописывать класс "str_wrap". Сам файл liMarquee.css для этого был немного изменен,
архив с демо обновлён.
В Хроме все супер, но в ИЕ и Мозиле неприятная особенность:
Постараюсь понятно объяснить.. Когда текст-содержимо е бегущей строки заканчивается, оно уходит "за горизонт" и пока последний элемент не уйдет, бегущая строка не побежит снова, получается "разрыв".
Можно ли сделать, что бы бегущая строка шла без такой паузы и без разрывов, что бы сразу за последним элементом шел первый?
Спасибо, надеюсь вы меня поняли :)
При инициализации плагина установите параметр "circular" в значение "true". В случае если ширина вашей строки больше ширины своего родителя в котором она движется, то эта строка будет непрерывна. Параметр работает во всех браузерах включая IE7,IE8
$('.str').liMarquee({
...
circular: true, //Если "true" - строка непрерывная
...
});
на сайте приведен один код, в архиве - другой. в архиве 2 экземпляра.
И правда ;), спасибо.
Архив и статья обновились.
Параллельно был добавлен новый багфикс. Обновление плагина до версии 3.0
У меня были небольшие проблемы при установке, но уважаемый LiMasscode ответил очень быстро и все проблемы разрешились, за что ему особая благодарность.
Спасибо за идею, допилил. Скачайте заново архив
24.05.2013 - Добавлено движение по вертикали вниз direction: 'down'
Перекачайте заново архив
Пользуйтесь на здоровье
ничего не помогает. У меня движок интенет магазина openkart 1.5.4.1, я новичок люди добрые может кто подскажет как быть и куда править?
Здесь нет ясновидящих,есл и не можете описать проблему то киньте хотя бы ссылку на нерабочий пример
Можно!
Присвойте блоку с картинкой ширину, равную ширине экрана + ширина картинки.
Спасибо большое за него!!!
И вам спасибо. Пользуйтесь на здоровье
подскажите, а как сделать смену картинок слева-направо? Или я туплю?
Вы не тупите. В плагине не было данного функционала. Но рас уж вам понадобилось движение слева на право, теперь это возможно. Скачайте заново архив.
Демо оценили :) Еще раз спасибо.
Однако нашелся небольшой баг - если "задеть" бегущую строку каким-то определенным образом мышкой, начинает крутиться быстее. Причем скорость может быть разной, но выше обычной. Она крутится до конца списка, а потом движение опять нормальное
Напишите подробнее каким именно образом вы задеваете строку
Напишите пожалуйста какой у вас браузер (название и версию)
IExplorer version: 8.0.6001.18702
Opera 12.15
Firefox 20.0.1
Все что угодно. Кидайте ссылку на нерабочую страницу
Modx 1.0.10.
Аналогично - Кидайте ссылку на нерабочую страницу
circular: true,
В примере картинки зациклены так как вы говорите
http://cs309831.vk.me/v309831522/d3ad/0U75xuI23kQ.jpg
Нельзя ли сделать вот так (извиняюсь за художественные способности):
http://cs309831.vk.me/v309831522/d3b4/TnLAtIK6BRc.jpg
Извиняюсь за резкость, но это смешное пожелание. Зачем фотографии запускать в карусель если они и так все видны на странице. Еще смешнее только одна фотка, продублированна я N - раз
width:100%;
на меньшее значение, например 50%
Это не пожелание, это вопрос был, на "можно/нельзя"; ) Клиентам нужна непрерывная циклическая бегущая строка из логотипов спонсоров,ибо изначально сделанный слайдер (с автоматическим перелистыванием постраничным) их не устроил: нужно непрерывное движение без пауз и пробелов. Спасибо за ответы, вопрос снят, получилось сделать, как требуется.
http://files.mail.ru/767EE14874194DF1B744C6F004C79311
Адрес странички: http://neturoki.ru/begushhaya-stroka-dlya-sajta
p.s. В статье описывается другой плагин. Просто я не хотел вставлять вордпрессовский плагин ради одной статьи. В следующей статье хочу описать особенности подключения Вашего плагина к WordPress с ссылкой на Ваш ресурс (если Вы не против).
Я только "ЗА!"
Скорее всего у вас уже был подключен фреймворк jQuery более ранней версии.
И либо сейчас у вас подключены оба.
Либо слайд шу использует события, которые не поддерживаются версией jquery-1.9.0.
Точнее можно будет сказать если вы дадите ссылку на сайт
"В Хроме все супер, но в ИЕ и Мозиле неприятная особенность:
Постараюсь понятно объяснить.. Когда текст-содержимо е бегущей строки заканчивается, оно уходит "за горизонт" и пока последний элемент не уйдет, бегущая строка не побежит снова, получается "разрыв".
Можно ли сделать, что бы бегущая строка шла без такой паузы и без разрывов, что бы сразу за последним элементом шел первый?"
У меня такая же проблема, только в хроме. Все перепробовал ничего не помогает, даже в експлорере работает, помогите пожалуйста.)))
Если у вас ширина бегущей строки больше ширины родительского блока, то вам нужно использовать параметр "circular: true".
В этом случае строка будет замкнута, во всех браузерах.
Но если ширина вашей бегущей строки меньше ширины родителя, то у вас ничего не получится.
сайт http://chip18.ru/
в браузерах chrome и opera
Это из-за стилей bootstrap:
В них прописана max-width для всех изображений 100%
Я перебил это значение. Скачайте заново архив и замените файл liMarquee.css
Спасибо Вам большое, очень помогли, но появилась еще одна проблема, теперь картинки в бегущей строке открываются не с первого раза клика мышкой, а со второго или третьего.
Мой сайт http://vending.in.ua.
Цитирую Иван:
Ответ выше
Непонятные скачки где-то на втором символе. Такой же эффект был и в остальных плагинах marquee.
link: dev.8bit.fm
Ваше проблема связана с тем, что при инициализации плагина строка пустая.
Это ведет за собой неправильное вычисление ширины и как итог то, что вы видите у себя на сайте.
Я добавил поддержку плавающей ширины строки. Скачайте заново архив и замените свой файл jquery.liMarque e.js
Мой сайт http://vending.in.ua.
Спасибо за отличный плагин!
Обязательно финансово поддержу проект, но мне надо бы разобраться с одной штукой)))
Дело в том, что я разместил в данной бегущей строке html-таблицу в 3 строки и 10 столбцов. Когда таблица прокручивается, то после неё остается пустое пространство. И пока она полностью не уйдет влево, то движение заново справа не начинается... Как можно решить проблему, чтобы прокрутка шла без демонстрации пустого пространства?)) понимаю, что таблица - это единичный элемент, и с таблицей ничего не выйдет, но какие могут быть аналоги, чтобы прокрутка шла без пустоты? у меня нечто типа фотогалереи, где изображения в несколько столбцов и в три горизонтальных ряда!
Заранее спасибо! Я не профессионал, только учусь))
С уважением, Александр.
Не вижу проблем Главное задайте таблице ширину.
Я что-то не так делаю, не получается)) потом ещё раз попробую, спасибо))
Если не получится, киньте ссылку - я попробую помочь
PS
или я просто не нашёл эту настройку
Спасибо за наводку, добавлю в новом релизе
Текст бежит слева направо, все хорошо.
НО он начинается сразу слева и не успеваешь прочитать начало строчки, как сделать чтобы он начинался с середины или просто задать кол-во пикселей от левого края для старта?
Решение этой проблемы добавлено в новую версию плагина liMarque v3.6
Скачайте заново архив
Скачал но ничего не обновилось, или там нужно задать какой то параметр?
http://jsfiddle.net/7JN55/
Вот ссылка где видно что текст сразу уходит влево и начало строки не успеваешь прочитать.
Убрал из кода все лишнее.
http://jsfiddle.net/yurik417/7JN55/1/
Если текст длинный, то проблема остается.
http://jsfiddle.net/Vakas/72Gmk/3/
Что же вы сразу не сказали, что текст длинный.
Тогда либо такой вариант:
немного изменен код плагина + параметр "circular: false"
http://jsfiddle.net/yurik417/72Gmk/5/
либо такой:
У строки слева добавлен отступ в 400px
http://jsfiddle.net/yurik417/73daY/334/
Чтобы подключить xml файл, вам нужно при инициализации плагина указать путь к этому xml файлу в параметре "xml", например так:
$('selector').liMarquee({
xml:folder/myte xt.xml
});
Если файла нет, ставим "false"
$('selector').liMarquee({
xml:false
});
Это значение по умолчанию, его можно вообще упустить
Есть вопрос. Зачем в плагине параметры: 'rowUp', 'rowDown', 'stop'? как их применить?
У меня задача: в однострочном блоке организовать поочередной показ строк многострочного текста (строки короче ширины блока). Причем на каждой строке задержка (для прочтения) и плавный переход к следующей. Не могу, пока, настроить Ваш плагин на такие требования. Возможно ли?
Нужный вам функционал я добавлю в новый релиз в ближайшее время. А по поводу параметров - это ненужный код, который остался от плагина liEquakizer случайно
Скачайте заново архив. Демо внутри.
Что именно не работает в вашем случае?
Включаю circular:true, а пустое пространство все равно появляется
Скорее всего у вас мало контента (ширина контента меньше ширины строки).
В таком случае сделайте копипаст вашего контента несколько раз, чтобы общая ширина контента превысила ширину строки.
у меня вертикальная прокрутка и высота контента значительно превышает высоту родительского дива... раза в 4
1) Большая просьба детально описывать проблему изначально.
2) Если у вас прокрутка вертикальная, то значение имеет только ширина родительского элемента ".str_wrap"
3) Если вы все подключили правильно, но плагин у вас все равно не работает, значит все таки подключили неправильно. И в таких случаях кидайте ссылку на нерабочий пример
эмм.. сайт локальный могу скинуть на почту или ещё куда-нить, ток скажите куда)
limasscode
скинул
Ваше лекарство, метод "update"
Вызывайте его каждый раз после того как вставляете новый контент в строку.
Вот пример:
http://jsfiddle.net/73daY/344/
спасибо большое за помощь, все работает, правда с косяками, но я думаю, что это у меня проблема, хотя хз, попробую разбираться)
Кто-то уже отлавливал этот "лохнесский" баг и писал в коментах. Сколько не пытался, у меня отловить его так и не получилось.
Светлана, у этого плагина нет такого функционала.
Вы уже не первый человек с такой просьбой, поэтому в следующем релизе постараюсь добавить что-то подобное
А пока копайте в сторону вертикальной карусели
Еще у меня вопрос по браузерам. Попробовала с движением влево. В IE все шикарно работает, в Opera не так плавное, как в IE. А вот в Mozilla происходят залипания движущейся строки - небольшие остановки. Можно ли это как-то победить?
В планах внедрение CSS анимации, но это в следующих версиях
Нужна ссылка на нерабочий пример
js/bootstrap.js
js/jquery.liMarquee.js
Я подключал скрипты в таком порядке, если bootstrap и limarquee поменять местами, то страница перестает загружаться.
gorago.ru не рабочий пример, там где написано "привет"
У вас незакрытый тег <link rel="stylesheet " href="#"font-size:0;padding:0;margin:0;"> trap-responsive .css"
$('.my-css-class').liMarquee({...
...
});
Бежать конечно начало, но как-то коряво. Даже не могу объяснить проблему. Вы пробовали так тестировать? Спасибо.
У вас все правильно подключено.
Вот аналогичный пример: http://jsfiddle.net/73daY/361/
Понадобилось остановить полоску, а потом оновить ее..
но к сожалению такого функционала нет..
более того, в предидущих версиях был функцонал остановки, но визвать ее, так ы не удалось...
есть ли возможность остановить(и/ил и)обновить параметри для полоски?
спасибо
Пользуйтесь методом "update":
$('.str').liMarquee('update')
В архиве есть пример
в новой все работает, так как вы сказали!=)
Добавлено.
Включите параметр "inverthover":
$(window).load(function(){
$('.str_wrap'). liMarquee({
inverthover:tru e
});
});
Баг исправлен. Скачайте заново архив
http://mymeet.org/?page_id=381#
по ссылке уже другой плагин.
Если вопрос актуальный, измените
.
Как сделать чтобы при обновлений страницы, текст или картинки не выходили за рамки сайта. И еще где менять размер и цвет текста?
Сижу долгое время и не могу разобраться почему не работает плагин на сайте. Если не трудно , могли бы вы указать на ошибку?
Спасибо
Ссылку на нерабочий пример
hazardclub.ru внизу страницы полоска баннеров
Для начала подключите только одну версию jquery. У вас их сейчас три
Я вас не совсем понял.
Могли бы вы подробнее описать?
Спасибо
Если вы про фон, то поправьте стили:
.str_wrap {
background: none;
}
.str_wrap.str_active {
background: none;
}
а
Shadowbox.setup
для динамических ссылок, указав класс к которому нужно автоматически подключать плагин увеличения изображений. Об этом указано внизу страницы:
http://shadowbox.ru/usage.aspx
Может кому нибудь поможет.
Все верно, картинки в блоке "str_move_clone " строятся динамически, поэтому на них нужго дополнительно вешать инициализацию. "Shadowbox.setu p" решает эту проблему. Или же можно подключать плагин "shadowbox" после инициализации плагина "liMarque"
Разобрался! Все работает! Спасибо большое
Поправить удалось через файл CSS вроде бы нормально... Подскажите а можно ли сюда включить кнопки влево вправо, чтобы нажимая на них листалось быстрее влево или вправо!? Спасибо!
Вам нужно менять скорость или направление ?
Цитирую LiMasscode:
Знаете планировалось, чтобы строка не просто бежала, а к примеру через 10-15 секунд прокручивалась. .., т.е. отображается три картинки 10-15 секунд, потом они уходят влево на их место приходят другие три картинки и т.д. Можно ли вот так это поправить!? СпасибО!
Нет. Воспользуйтесь плагином caroufredsel
http://github.com/gilbitron/carouFredSel
Воспользуйтесь плагином
http://github.com/gilbitron/carouFredSel
Почти ничего не понял. Может кинете ссылку
Скачайте заново архив. И попробуйте еще раз
В чем моя проблема? Помогите люди добрые
Будет возможность помочь, если вы кинете ссылку на нерабочий вариант. Или сверьте сами вот этим примером: jsfiddle.net/73daY/510/
Только что проверил, все работает.
Если проблема действительно есть, присылайте ссылки, скрины, название и версии браузеров, версию iPad
destroy - добавил.
А что вы имеете ввиду под словами:
"установки исходного значения" ?
Есть маленький нюанс, подскажи пожалуйста как исправить ?
Сделал бегущую строку из картинок в , хроме,IE и даже на айфоне строка двигается плавно, а вот в Opera чуть подвисает :( микро задержка, дергается картинка (чуть зависает)
Заранее благодарен!
причин может быть много:
- загрузка процессора
- старая версия браузера ( с плохой производительностью)
- большое кол-во открытых вкладок
Цитирую Артём:
курсор:
.str_wrap.str_active {
cursor:default
}
Вам нужен другой плагин, например
"carouFredSel" http://github.com/gilbitron/carouFredSel/archive/master.zip
Спасибо, но к сожалению ссылка не работает!
Ссылка работает 100% - вы что-то не так делаете
А вы попробуйте инициализироват ь плагин так как указано на сайте, внутри функции
$(window).load( function(){
$('.str_wrap').liMarquee();
});
Инициализацию можно прописать тоже между и или в отдельном js-файле но уже без тега
Спасибо за отличный плагин! Скажите у его можно применять на сгенерированнны й контент?
Допустим, у на сайте блок наполняет конент (Ajax запросом) а потом весь конент этого блока нужно прокрутить.
Во-первых вы можете запускать инициализацию после формирования кода аяксом
Во-вторых у плагина есть метод: 'update'
$('.str').liMarquee('update');
как раз для такого случая
http://jsfiddle.net/73daY/593/
Нет. Для этого подключайте дополнительно плагин подходящей галереи
Киньте ссылку на сайт или укажите версию jquery, которую использует ваше слайд-шоу
Был в отпуске. Подключите еще раз и отпишитесь
Почитайте что написано на странице "default.html" из архива и вам не нужно ничего будет чистить.
Цитирую Александер:
нет такой возможности
Нет. Воспользуйтесь плагином caroufredsel
http://github.com/gilbitron/carouFredSel
А именно jquery-1.9.1.min.js
и jQuery JavaScript Library v1.3.2
Никак не хотят вместе работать(
Спасибо
НетЦитирую spacemaster:
Возьмите скрипт отсюда
http://jsfiddle.net/73daY/649/
Я переписал его специально для ранних версий jQuery, использующих событие .bund()
Пример на этом сайте http://www.ukrgasbank.com/ukr/
Нет
Возьмите скрипт отсюда
http://jsfiddle.net/73daY/649/
Я переписал его специально для ранних версий jQuery, использующих событие .bund()
Только добавь swipe и connected elem.
Есть скайп?)
Пишите на почту
limasscode
Суть простая - определение какие именно элементы сейчас выведены на экран и возможность вставки непосредственно после этой позиции (сценарий - обновление ленты с новостями с приоритетом на новые поступления без разрывов и скачков в строке)
Пишите на почту
limasscode
Вот ссылка на страничку (снизу баннерная лента): http://kupidon.ucoz.ru/gb
У вас на сайте уже подключена библиотека jQuery версии 1.7.2
Это значит что подключать 1.9.0 уже не нужно
Не сработало почему-то ((.
Не сработало потому что вы вставили код с ошибкой!
У вас:
$(window).load(function(){
$('.str3').liMa rquee();
direction: 'left',
loop:-1,
scrolldelay: 0,
scrollamount:10 0,
circular: true,
drag: true
})
А нужно так:
$(window).load(function(){
$('.str3').liMa rquee({
direction: 'left',
loop:-1,
scrolldelay: 0,
scrollamount:10 0,
circular: true,
drag: true
})
})
Вроде все уже исправила, но почему-то не сдвигается с места (.
Плагин должен подключаться после подключения библиотеки на основе которй он работает.
Тоесть код
< script src="/liMarquee /jquery.liMarqu ee.js" >
нужно вставлять на страницу ниже кода
< script src="/px.png"font-size:0;padding:0;margin:0;"> ucoz.net/src/jq uery-1.7.2.js" type="text/java script" >
Единственное, что я не поняла, почему моя бегущая строчечка не захотела работать с баннером LiveInternet (в его коде тоже скрипт, может поэтому). Но я не расстроилась, просто его в статистику вынесла )). СПАСИБО !!!
http://stroy-alliance.ru/
Запускайте после изменения размера шрифта метод "update":
$('.str').liMarquee('update')
$('.str3-2').liMarquee({scrollamount: 60});
Соответственно плагин опять инициализируетс я и добавляются внутри не нужные элементы. При еще одном клике - вообще хаос начинается. Даже пытался сделать что то типа
var scroller = $('.str3-2').liMarquee();
потом по клику
$('.informer-na v').on('click', function() {
scroller.scroll amount = 60;
scroller.update (); - либо так
$('.str3-2').li Marquee('update ') - либо так
})
Оба варианта не дали результата.
Добавлено в плагин..
Скачайте заново архив и посмотрите демо: "Изменение скорости движения"
Такой функционал не относится к функциям бегущей строки и может работать параллельно.
Пример увеличения:
.imgClass {
transition: all 0.2s ease 0s;
}
.imgClass:hover {
transform:scale(1.2)
}
Я добавил в Хэад все подключаемые файлы и строки инициализации плагина.
Затем в нужном мне месте указал следующее:
Но прокрутки нет. Просто 3 кликабельных изображения. Весь Див находится в ячейке таблицы. Помогите, пожалуйста, т.к. собственные знания разобраться не позволяют(
gitie.ru
Попробуйте так:
http://jsfiddle.net/yurik417/73daY/693/
вот сайт: http://aktau-as.kz/
cms DLE 10.3 шаблон Bootstrap v3.3.0
Помогите plz
Верните плагин на сайт и я посмотрю что не так.
1. Сначала проверьте не подключили ли вы две библиотеки jQuery разных версий одновременно.
Если да, то оставьте только одну (ту что была у вас). Если при этом бегущая строка работать не будет то желательно чтобы вы выложили страничку в интернет и кинули сюда ссылку.
Уберите jquery 1.9.0 и пропишите инициализацию плагина заменив "$" на "jQuery" вот так:
jQuery(window).load(function(){
jQuery('.str').liMarquee();
})
Сделайте больше картинок или продублируйте те что уже есть. Суть в том чтобы их общая ширина была больше ширины строки
Нужно смотреть на живой пример
В новой версии есть методы "pause" и "play". Пользуйтесь ими:
http://jsfiddle.net/yurik417/73daY/711/
Спросите совета на одном из форумов освещенном OpenCart:
http://www.google.com.ua/search?q=ocStore+&ie;=utf-8&oe;=utf-8&aq;=t&rls;=org.mozilla:ru:official&client;=firefox-a&channel;=sb&gfe;_rd=cr&ei;=LwByVKHgCNGAsAHyg4KoAg#rls=org.mozilla:ru:official&channel;=sb&q;=ocStore+%D1%84%D0%BE%D1%80%D1%83%D0%BC
Пытаюсь скрестить этот плагин с Joomla, но не удается запустить прокрутку - постоянные конфликты с другими файлами jquery из других модулей.
Подскажите как можно устранить конфликты.
Некоторые установленные модули со своими версиями jquery используют файлы xxx.noconflict. js. Может и с Вашим плагином можно применить такой же метод?
noconflict - служит для других целей.
1. Вам не нужно с моим плагином подключать еще и библиотеку jQuery, если она уже есть на вашем сайте.
2. Вам нужно обратить внимание на версию jQuery, которая уже подключена на вашем сайте, и написать её здесь.
Скорее всего у вас старая версия jQuery, которая не распознает некоторые функции. Это легко решается.
jQuery v1.11.1 min
jQuery-1.8.3. min
Если я подгружаю Вашу jQuery-1.9.0. в конце хидера (после всех объявлений js) - скроллинг не работает
Если я подгружаю вашу jQuery-1.9.0. в самом начале хидера (до всех объявлений js) - скроллинг работает.
В обоих случаях в консоли ошибки типа
Using //@ to indicate sourceMappingUR L pragmas is deprecated. Use //# instead jquery-1.9.0.mi n.js
TypeError: $(...).addEvent is not a function
Метод getPreventDefau lt() является устаревшим. Для его замены используйте метод defaultPrevente d. jquery-1.9.0.mi n.js
Вам нужно оставить только одну библиотеку, и по возможности кинуть ссылку сюда
Проблема не в строке, а в устройстве или браузере на котором вы её просматриваете. Возможно устаревшая версия браузера.
Firefox, chrome, IE, opera - проблемы не обнаружены.
Возможно у вас еще чем-то загружен процессор
Кидайте ссылку, разберемся!
http://jsfiddle.net/yurik417/73daY/726/
Вот мой файл, надеюсь Автор добавит его в шапку:
http://drive.google.com/file/d/0B1Wp_8jgLcTzS2FrVVNFT2pGcm8/view?usp=sharing
Скорее всего эти ограничения имеют место только в локальной версии. Попробуйте вылить в интернет
Есть потребность, чтобы картинки передвигались рывками: т.е. вот сейчас на экране m картинок, они поехали влево (вправо, без разницы), сдвинулись на 1 картинку, замерли на n секунд, затем снова сдвинулись, на 1 картинку, снова замерли и т.д. бесконечно
Воспользуйтесь плагином caroufredsel
http://github.com/gilbitron/carouFredSel
Подскажи пожалуйста как изменить курсор ( стрелочки в 4 стороны) при наведени на бегущую строку.
Заранее благодарен!
Измените свойство "str_move"
.str_move {
cursor:move; /*default, pointer*/
}
Указанный "недочёт" исчезает,если длина строки с картинками превышает ширину страницы,тюе если картинок достаточно много
http://prntscr.com/668exg
http://prntscr.com/668f2r
http://prntscr.com/668f8m
И второй вопрос - сейчас при загрузке страницы слайдер пустой и картинки постепенно выползают из-за края экрана. Можно ли сделать чтобы они сразу занимали весь блок?
2. Чтобы изображения появлялись на странице сразу после загрузки страницы добавьте в строку картинки так чтобы их общая ширина была больше ширины экрана
Вам нужен слайдер или карусель, но никак не бегущая строка
Вы допустили ошибку, но какую, я не могу сказать использую свои телепатические способности
В базовом варианте помогает замена p.direction на data('direction ') (т.е. как это сделано со scrollamount) и вызов update после смены direction, но тогда есть легкий баг - при смене движения с left на right бегущая строка прыгает на первый элемент. Возможно это можно быстро пофискить.
Потому что вы сделали что-то не так. Кидайте ссылку!
Нет такой функции. Непонятно как подружить её с замкнутой строкой.
Цитирую heksen:
$(window).load(function(){
$('.str4').liMarquee({
direction: 'up'
});
var newContent = 'another line another line another line another line another line another line '
//This is a function that adds another string
$('.addContent').on('click',function(){
$('.str_origin',$('.str4')).html( $('.str_origin' ,$('.str4')).ht ml() + newContent);
$('.str4').liMarquee('update')
return false;
})
})
Скажите пожалуйста, как бороться с высотой строки?
Нужно задать фиксированный размер.
Спасибо
Уточните вопрос!
Покажите свои параметры!
1. Если символ находится в самом начале родительского блока, то можно узнать Х координату этого блока:
$('блок').offset().left - относительно экрана
$('блок').position().left - относительно родителя.
К сожалению нет
Выложите в интернет и дайте мне ссылку. Я найду в чем у вас проблемма.
Бегущую строку вижу, проблем - не вижу. Опишите подробно, при каких обстоятельствах у вас перестает работать плагин.
Инициализация плагина должна осуществляться
после загрузки всего кода и изображений.
Для этого её нужно прописывать внутри функции "load"
jQuery(window).on('load',function(){
//Здесь код инициализации
})
добавил все как и написано
$(window).load( function(){
$('.anyClass').liMarquee();
})
In place of the text string can be any html code or picture
однако в месте, где вставил html код я вижу неподвижную фразу "In place of the text string can be any html code or picture" и все.
если что-то не так написал или лужно что-то еще дописать - скажите пожалуйста! очень нужно.
(нужна бегущая строка из изображений (стартовый размер 4500*1500), которые добавляю кодом: (и так еще 5 раз(количество изображений будет постепенно увеличиваться)))
помогите, пожалуйста
Смогу помочь, только если увижу ваш код подключения.
Разместите страницу в интернете и выложите ссылку
Скрипт очень помог. Спасибо за него.
Необходимо сделать возможность запуска бегущей строки с любой строки. Чтобы пользователь после перезагрузки страницы или перехода на другую продолжил просмотр бегушки с того места, на котором остановился.
Сохранение позиции и восстановление кукисами можно реализовать, но процедуры не нашел, можно ли добавить возможность старта с любой строки?
Попробую
I like using your script,but I want combined with form for the speed.
Код:
<label for="num1">Az ?rab?red</label>
<input placeholder="Number 1" id="num1">
<button>bevitel</button>
<p></p>
<!-- beviteli script -->
<script src="get-started.js"></script>
How can i use this in your script? Or other method?
Thank's
Gabor
RSS лента комментариев этой записи