虽然niceScroll插件非常好用，但是毕竟它不依赖css，只需要简单的js就可以设置漂亮的滚动条。
最近在项目中使用了niceScroll，表格中有一个水平滚动条。 垂直滚动条很容易错位，即滚动条会浮在半空中，而不是在div的顶部或右侧。 打开f12可以看到滚动条并没有直接定位在div上，而是在整个body的末尾，与要定位的div在同一层，这就导致了这个bug，尤其是在IE中，滚动条到处飞︿(￣︶￣)︿。
网上查了很多资料，好像没有这种情况。 也许他们的项目没有那么多垂直滚动条。 。 。 。 。
为了解决这个bug，我当时想到的就是在div上设置滚动条，这样就不会浮动了。 经过多次测试，发现position:absolute定位在要设置的div上，这样滚动条就会嵌套在上面，不会出现浮动和错位的情况。
没有定位时，滚动条位于body的末尾，如图：
定位的滚动条位于div上方，如图：
我使用wex5的网格形式，在网格的行中添加类名gridPositon设置为绝对定位jquery 滚动条在底部，然后在其父级设置为相对定位，“孩子和父亲长得很像”。这样的操作解决了滚动条浮动和错位的问题，但是IE下出现了一个新的bug，即键盘悬停和
点击选择时没有颜色（--cheating IE），然后再添加两层div，就解决了IE中没有颜色的问题。 所以最终的结构如下：
总结：只要使用的div是绝对定位的，滚动条就会嵌套在上面。 那个ie下面没有颜色，因为它是直接相对于它的父级定位的jquery 滚动条在底部，所以后来我把它改成在最外面的窗口中相对定位，这样我就不用费心去改变它的结构了。
发表评论