iScroll隐藏/显示滚动条

时间:2013-02-22 22:26:42

标签: javascript jquery iscroll

我正在尝试在我的iScroll div上实现悬停功能,我可以在其中显示/隐藏滚动条。我想让用户将鼠标悬停在div上并显示滚动条,一旦用户将鼠标移离容器,滚动条就会消失。

我一直在研究这个问题,看看它是否有可能但是没有多少运气试图找到解决方案。我发现iScroll有一个hideScrollbar参数,我可以在初始化新的iScroll对象时设置该参数,但不完全确定如何根据用户与滚动容器的交互动态设置参数。

非常感谢任何帮助。

2 个答案:

答案 0 :(得分:2)

以下代码将提供您想要的内容。 :)(经过测试的桌面和Android& iOS);

hideScrollbar: !isIDevice || isIDevice || isAndroid,
fadeScrollbar: !isIDevice || isIDevice && has3d,

这与vletech在112-113之前所说的相同。

答案 1 :(得分:1)

我似乎无法找到上面提到的参数hideScrollbar,但是解决这个问题的一个简单方法就是在其上添加自己的淡入淡出动画。

E.g。

$('#DivToHover').hover(
   function(){
      $('#ScrollBarDiv').fadeIn("fast");
   },
   function(){
      $('#ScrollBarDiv').fadeOut("fast");
   }
);

但如果你希望在移动设备上可以看到这个问题,这可能会导致一些问题。

修改

将第35行更改为。

isIDevice = (/iphone|ipad|Mozilla/gi).test(navigator.appVersion),

编辑2 再考虑一下,更好的方法是将第35行保留为(/iphone|ipad/gi)。但改变线112& 133到......

hideScrollbar: isIDevice && !isIDevice,
fadeScrollbar: isIDevice && !isIDevice && has3d,