javascript 单击按钮时水平滚动

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/11185598/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 12:19:30  来源:igfitidea点击:

horizontal scroll on clicking button

javascriptjqueryhtmlscroll

提问by Muhammad Usman

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

我想通过单击左右按钮来水平滚动 div 但它不起作用

$('#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

? 如何通过按字节单击滚动 div。我也想去掉滚动条

JS Fiddle

JS小提琴

回答by m90

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)?

如果您不想摆脱滚动条,为什么不更改裁剪内容的 CSS(即它的margin-left)?

Give the wrapping diva overflow:hiddenand use the following JS:

给包装divaoverflow:hidden并使用以下 JS:

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

Would look like this.

看起来像这样

?

?

回答by Th0rndike

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...

我使用 css 和边距进行滚动,溢出隐藏以隐藏栏,浮动以对齐图片并更改了一些 css...