Jquery TinyScrollbar-水平自动滚动

我使用jQuery tinyscrollbar水平滚动一组图像。现在我想启动自动滚动页面加载保持手动滚动选项以及

我遇到了一些解释如何在垂直的小金属棒上操作的答案，但我无法将其修改为在水平的小金属棒上操作

你能解释一下怎么编码吗。这是我第一次使用tinyscrollbar

---

我从网站示例中的

下载了它，将其设置为水平

$('#scrollbar2').tinyscrollbar({ axis: 'x'});

通过脚本滚动

$('#scrollbar2').tinyscrollbar_update( 50 );

其中，

50

是以像素为单位的数字。因此，要自动滚动，您可以使用

setInterval

setInterval(function() { /* scrolling code */ }, 1000); // every second...

---

确保您也复制了所有css，并下载了bg-scrollbar-track-x.png等的图像。 没有它，滚动条将无法渲染

这里是，仅供参考（注意，我将id从“scrollbar2”更改为“scrollbar-x”。您必须自己从tinyscrollbar站点获取图像：

#scrollbar-x { width: 800px; margin: 20px 0 10px; }
#scrollbar-x .viewport { width: 800px; height: 125px; overflow: hidden; position: relative; }
#scrollbar-x .overview { list-style: none; width: 1416px; padding: 0; margin: 0; position: absolute; left: 0; top: 0;  }
#scrollbar-x .overview img{ float: left; }
#scrollbar-x .scrollbar{ background: #EDEDED url(../images/scrollbar/bg-scrollbar-track-x.png) no-repeat 0 0; position: relative; margin: 0 0 5px; clear: both; height: 15px; }
#scrollbar-x .track { background: transparent url(../images/scrollbar/bg-scrollbar-trackend-x.png) no-repeat 100% 0; width: 100%; height:15px; position: relative; }
#scrollbar-x .thumb { background: transparent url(../images/scrollbar/bg-scrollbar-thumb-x.png) no-repeat 100% 50%; height: 25px; cursor: pointer; overflow: hidden; position: absolute; left: 0; top: -5px; }
#scrollbar-x .thumb .end{ background: transparent url(../images/scrollbar/bg-scrollbar-thumb-x.png) no-repeat 0 50%; overflow: hidden; height: 25px; width: 5px;}
#scrollbar-x .disable { display: none; }
.noSelect { user-select: none; -o-user-select: none; -moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; }

---

自动滚动不在这些示例中。我不擅长jQuery，所以我不知道如何进行。谢谢。当我从该网站下载代码并使用

$（'#滚动条2'）。tinyscrollbar（{axis:'x'}）；

它没有显示任何水平滚动条。当我在他们网站上查看示例代码的源代码时，我发现他们使用了不同的方法，我只是使用了。所以我不确定这一点。谢谢这不会单独起作用。你也必须修改css。参见Jamie m的答案。