Question

我在我的网络应用程序中使用了jquery jscrollpane插件http://jscrollpane.kelvinluck.com/。我想用它只在水平位置滚动。

如此处所示http://jscrollpane.kelvinluck.com/basic.html

这是我的HTML：

<div class="addbox horizontal-only scrollpane">
<h4><span class="addbox-text">Pick your best work from <b class="highlight-text">Flickr</b> to display in your portfolio</span></h4>
<div class="addmenu-item"><span class="addmenu-image"><img class="addmenuimage" src="http://farm8.staticflickr.com/7122/7424355198_72620895bd_m.jpg"></span><span class="addmenu-info">Orchid Profiles</span></div>
<div class="addmenu-item"><span class="addmenu-image"><img class="addmenuimage" src="http://farm8.staticflickr.com/7122/7424355198_72620895bd_m.jpg"></span><span class="addmenu-info">Orchid Profiles</span></div>
</div>

CSS：

.scroll-pane
{
height: auto;
max-height: 400px;
overflow: auto;
}
.horizontal-only
{
height: auto;
max-height: 200px;
}

JQuery的：

$(".addbox").jScrollPane();

但它不起作用（高度混乱，jscrollpane处于垂直位置）。以下是其余代码https://gist.github.com/2984404

的css

谢谢！

更新

请检查此jsfiddle http://jsfiddle.net/cWcWb/

Answer 1

这是因为.addbox的宽度足以显示所有内容而无需滚动（ 700px ）。

尝试将其更改为 400px ，您会看到水平滚动显示

jscrollpane - 水平滚动

1 个答案: