LucianRadu
LucianRadu

Reputation: 85

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

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?

Upvotes: 0

Views: 1075

Answers (2)

Florian F.
Florian F.

Reputation: 4700

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.

Upvotes: 1

Suresh Atta
Suresh Atta

Reputation: 121998

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?

Upvotes: 0

Related Questions