How can I fix height, container with scrollbar

I’m using a simple JavaScript. I change the container’s height and width. I think I need to fix the JavaScript, because it is working on the container which as height set in px, but I have set the height as %. The problem is appearing when you resize (you can’t see full img or there is too much space) on bottom of the container.

Or maybe I’m wrong… Any tips?

Link to CodePen 1. and to Javascript 2.:

  1. http://codepen.io/psairidas/pen/RaVwzw
  2. http://www.n-son.com/scripts/jsScrolling/jsScrollbar.html

That codepen looks ok to me.

I’d be hesitant to use js scroll bars, all you need to do is to give overflow: auto to an element with a constrained height of width to show them.

If you resize the browser you will see that the scrollbar height is not re-computed and therefore no good for responsive sites.

The documentation only mentions fixed heights so I don’t believe percentages are supported. The script would need to hook into the resize event and recompute the height of the scrollbars/content every time the window is resized.

Maybe look at this alternative which can handle fluid widths and heights.

As Mark said custom scrollbars are rarely a good addition to an established mechanism.

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.