Scroll inside a div with overflow using jquery (or javascript)

Question

I have a div with a fixed height and overflow-y : scroll which I am loading via ajax. I'm currently looking for a possibility to scroll the content inside the div (using the mouse wheel) but without displaying the scroll bar. Can anyone help?

Possible duplicate - http://stackoverflow.com/questions/11548072/building-scrollable-div-without-scrollbar — Jay Blanchard, Feb 14 '13 at 14:38
You can easily achieve this playing with another parent DIV with `overflow:hidden;` just hiding the scrollbars beneath the right edge — Roko C. Buljan, Feb 14 '13 at 14:40

score 1 · Accepted Answer · answered Feb 14 '13 at 14:50

Another way is to use jquery.mousewheel : https://github.com/brandonaaron/jquery-mousewheel

On mouse wheel, compute scroll urself :

$('.toScroll').on('mousewheel',function(event, delta, deltaX, deltaY){
    if(!$(this).attr('data-scrolltop')){
        $(this).attr('data-scrolltop',0);
    }
    var scrollTop = parseInt($(this).attr('data-scrolltop'));
    scrollTop += (-deltaY * lineHeight);
    $(this).attr('data-scrolltop',scrollTop);
    $(this).scrollTop(scrollTop);
});

I made a Fiddle as a demonstration : http://jsfiddle.net/W2pZB/

The only problem is about the var-fixed line height.

score 0 · Answer 2 · edited May 23 '17 at 12:27

0

You can do it by applying overflow:hidden and after display-none on the scroll-bar using css

And here you can find a same thing in below question .

jQuery: How do I scroll the body without showing the scroll bar?

edited May 23 '17 at 12:27

Community

1
1

answered Feb 14 '13 at 14:40

Suresh Atta

120,458
37
198
307

as @jay suggested you can find a working fiddle also .. cheers :) – Suresh Atta Feb 14 '13 at 14:42

Scroll inside a div with overflow using jquery (or javascript)

2 Answers2