Scroller

Scrolls content of container

by DoomHamster

HTML

<div id="scrollbar" style="width:80px;height:20px;overflow:hidden;white-space:nowrap;">
Your loooooooooong content asdfasdfasdfasdf
</div>
<div class="scroll right" style="float: right; cursor: pointer; margin-bottom: 5px; margin-right: 5px;">RIGHT</div>
<div class="scroll left" style="float: left; cursor: pointer; margin-bottom: 5px; margin-right: 5px;">LEFT</div>

JavaScript

$('.scroll.left').click(function () {
    console.log('ok')
    $('#scrollbar').animate({
        scrollLeft: '-=153'
    }, 1000);
});
$('.scroll.right').click(function () {
    console.log('ok')
    $('#scrollbar').animate({
        scrollLeft: '+=153'
    }, 1000);
});