JQuery ScrollLeft() does not work

Question

i am having a problem with the scrollLeft() function in JQuery. I am basically trying to create a fork of this jsFiddle (http://jsfiddle.net/2RRWS/), a vertical news ticker.

I need a similar script that scrolls horicontially. I was able to produce a horicontal scrollbar, but I cant control it via the scrollLeft function.

Any ideas what I am doing wrong?

var $container = $("#scrollContainer");
$container.scrollLeft(300);

See my (very short) script at: http://jsfiddle.net/RA52y/

Answer 1

1 - include jQuery in the project ( this wasnt include on the fiddle) - make sure the js is run on document ready

2 - amend the html as below :

<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 - use this 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);

It worked fine for me after that on your jsfiddle