I want to horizontally scroll a div by clicking on the button Left and Right but it is not working

$('#left').live('click' , function(){
$('#myDiv').scrollLeft(300)

})
$('#right').live('click' , function(){
$('#myDiv').scrollLeft(-300)

})

​ How can I scroll a div by a bytton click. I also want to remove the scroll bar

JS Fiddle

I want to horizontally scroll a div by clicking on the button Left and Right but it is not working

$('#left').live('click' , function(){
$('#myDiv').scrollLeft(300)

})
$('#right').live('click' , function(){
$('#myDiv').scrollLeft(-300)

})

​ How can I scroll a div by a bytton click. I also want to remove the scroll bar

JS Fiddle

• javascript
• jquery
• html
• scroll

2 Answers 2

If you don't want to get rid of the scroll bars, why don't you just alter the CSS of the cropped content (i.e. its margin-left)?

Give the wrapping div a overflow:hidden and use the following JS:

$('#left').click(function(){
    $('#myDiv').css('margin-left','-300px');
});
$('#right').click(function(){
    $('#myDiv').css('margin-left','0');
});

Would look like this.

​

Is this what you want?

jsfiddle

i used css and margins for scroll, overflow hidden to hide the bar, float to align the pictures and changed some css...