jScrollPane - 如何为滚动条获取单独的箭头

Question

我正在使用jScrollPane来使jQuery使滚动条看起来像Windows 8滚动条（我正在制作一种Metro / Modern UI模型，只是为了好玩）。我看起来滚动条很漂亮，但我有一个问题。没有办法（至少在当前版本中）获得左箭头图像和右箭头图像（因为我使用水平滚动，就像在Metro UI中一样）。我在这里看到了一些问题，他们展示了一个jQuery灯主题，它给你单独的箭头（Lozenge主题），但它是一个痛苦的屁股，而不是我正在寻找的。任何想法??

Answer 1

为什么你不能修改类.jspArrow的CSS来将箭头图像显示为背景图像？

观看其中一个演示here，我看到了这个css：

.jspArrow
{
    background: #50506d;
    text-indent: -20000px;
    display: block;
    cursor: pointer;
}

将其更改为：

.jspArrow
{
    background: url('your_arrow_img')
    text-indent: -20000px;
    display: block;
    cursor: pointer;
}

jspArrowRight和jspArrowLeft有单独的类可以帮助你进一步。

如果这不起作用，我肯定知道你可以为滚动条创建“填充”，他们称之为文档中的装订线。我会创建装订线，然后在滚动条轨道上使用CSS伪前后元素来渲染箭头。