1

要求:启用鼠标滚轮垂直滚动而不显示滚动条并保持背景。

使用下面的解决方案,我可以按照下面提到的解决方案来达到预期的效果

    <div style='overflow:hidden; width:200px;'>
       <div style='overflow:scroll; width:217px'>
          My mousewheel scrollable content here....
       </div>
    </div>

Link :移除 HTML 滚动条但允许鼠标滚轮滚动

我目前遇到的问题是在子 div 内部,有一个具有交替颜色和样式的表格,我想保持背景。目前,使用上述解决方案,17px的滚动条区域是空的,看起来像是有人把滚动条擦掉了。问题是:

(a) 我怎样才能保持背景?

(b) 我能否将垂直滚动条的宽度减小到 1px,使其仅显示为细线,用户甚至不会注意到滚动条的存在。

4

1 回答 1

0
    I tried a different solution using jQuery to avoid the background problem      

    //My page is split into 2 sections div1 and div2
    //div1 - Div on Left Hand Side
    //div2 - Div on Right Hand Side
    //On scrolling mouse in either of the divs, the other div should move up/down 

    Tried the below code and it works. Hope this helps someone     


    $( '#div1' ).bind('mousewheel', function(event, delta, deltaX, deltaY) {

     console.log(delta, deltaX, deltaY);

      var panelPos=$('#div2' ).scrollTop();
     $( '#div2' ).scrollTop(panelPos - (deltaY * 30));
     $( '#div1' ).scrollTop($('#div2').scrollTop());

     });
于 2013-07-11T02:46:41.883 回答