JQuery ScrollLeft() не работает
У меня проблема с функцией scrollLeft() в JQuery. Я в основном пытаюсь создать форк этого jsFiddle ( http://jsfiddle.net/2RRWS/), вертикального тикера новостей.
Мне нужен похожий скрипт, который прокручивает по горизонтали. Мне удалось создать горизонтальную полосу прокрутки, но я не могу управлять ею с помощью функции scrollLeft.
Есть идеи, что я делаю не так?
var $container = $("#scrollContainer");
$container.scrollLeft(300);
Смотрите мой (очень короткий) скрипт по адресу: http://jsfiddle.net/RA52y/
1 ответ
Решение
1 - включить jQuery в проект (это не было включено на скрипке) - убедиться, что js запущен на готовом документе
2 - изменить HTML, как показано ниже:
<div id="scrollContainer">
<div id="content" style="white-space:nowrap; padding-left:600px;">134 1234 1234 12355 134 1234 1234 12355 134 1234 1234 12355 134 1234 1234 12355 134 1234 1234 12355 134 1234 1234 12355 134 1234 1234 12355 134 1234 1234 12355 134 1234 1234 12355</div>
</div>
3 - использовать это JS:
var $container = $("#scrollContainer");
var $content = $("#content");
containerWidth = $container.width();
contentWidth = $content.outerWidth();
contentLeft = 0;
scrollLeft = 0;
setInterval(function() {
if (scrollLeft > contentWidth + containerWidth)
scrollLeft = 0;
$container.scrollLeft(scrollLeft++);
}, 20);
После этого у меня на jsfiddle все заработало нормально