Clever Geek Handbook

How to scroll a window without overflow

I need to scroll in a window, but my window height is too small to scroll. Is it possible to scroll when the height of the container is too small to see the scrollbar. Here is my code for scrolling:

setTimeout(function(){
  $(window).scrollTop($(window).scrollTop()+1);
  $(window).scrollTop($(window).scrollTop()-1);
}, 800);

I need to scroll the window or body even if its height is less than 100px.

+3


source to share


4 answers


I believe what you want to set min-height

110%

to html

in your CSS. I would do:

html {
  min-height: 110%;
}


Here is a demo: http://jsbin.com/sebago/1/edit?html,css,output

+3


source


To see the scrollbar, just use the CSS property overflow:scroll;

in your container.



0


source


If you are defining a fixed height in your element, you can use overflow: scroll to enable scrolling.

0


source


You need to hide the scrollbar first to not take up space (because you don't have too much space in the element), you can do it with the following css:

#elementId{ 
   overflow: hidden;
}

Then you need to bind the mousewheel event over the "small" element and call a function to manually scroll your element, you can do this with the following jQuery code:

$('#elementId').bind('DOMMouseScroll mousewheel', function(e) {
    $('#elementId').scrollTop($('#elementId').scrollTop()+1);
});

This example is simplified only for binding the mousewheel event in general, to know if up or down you can use the JQuery Mouse Wheel Plugin you can get here .

0


source






More articles:


All Articles