Javascript 如何在div的顶部和底部获得水平滚动条？

因为我很确定没有原生的html或CSS方法可以做到这一点，所以我愿意使用JavaScript来实现这一点。显然，我可以使用CSS中的

overflow:auto

在div底部获得一个滚动条。是否有一些JavaScript可以从底部“克隆”滚动条并将其放置在div的顶部？也许还有另一种方法？

您可以使用jQuery的UI。您可以在NetTuts上在线阅读实现此效果的教程：

您可以在真实元素之上创建一个新的虚拟元素，具有相同的内容宽度以获得一个额外的滚动条，然后将滚动条与

onscroll

事件绑定在一起

功能双滚动（元素）{
var scrollbar=document.createElement（'div'）；
scrollbar.appendChild（document.createElement（'div'））；
scrollbar.style.overflow='auto'；
scrollbar.style.overflowY='hidden'；
scrollbar.firstChild.style.width=element.scrollWidth+'px'；
scrollbar.firstChild.style.paddingTop='1px'；
scrollbar.firstChild.appendChild（document.createTextNode（'\xA0'））；
scrollbar.onscroll=函数（）{
element.scrollLeft=scrollbar.scrollLeft；
};
element.onscroll=函数（）{
scrollbar.scrollLeft=element.scrollLeft；
};
element.parentNode.insertBefore（滚动条，元素）；
}
DoubleScroll（document.getElementById（'DoubleScroll'））
#双滚动
{
溢出：自动；溢出-y:隐藏；
}
#双涡卷
{
保证金：0；
填充：1em；
空白：nowrap；
}


Lorem ipsum dolor sit amet，Concetetur Adipising Elite，sed do
临时性的劳动和生产许可证。美国犹他州
以最小的成本为基础，进行ullamco laboris实习
从一个普通的消费品中购买。

我也想到了同样的方法，但开箱即用，它似乎只能做垂直条。不确定要扩展多少工作量。恐怕我没有看到JScRangPANE允许你在Doad的顶部放置一个滚动条。我是不是错过了？@拜伦。你的要求非常具体，你可能需要带一个现有的滚动条小部件并修改它。@拜伦：考虑jQuery的UI滑动条。我已经添加了一个链接，以及一个教程的链接，展示了如何使用它。非常好的解决方案。我想在我的站点上都使用这种技术，所以我将使用一个类名并对每个类执行jquery，如：$（document）.ready（function（）{$（'.doubleHorizontalScroll'）。each（function（index，element）{DoubleScroll（element）；}）；}）；这对我来说太棒了！我还可以很好地处理和文档.GetElementsByCassName（'doublescroll'）[0]（当然。我在这里有一个解决方案来解决这个问题，而不是#在css中），我注意到下面接受的解决方案中有一个奇怪的bug，我已经详细说明并解决了：