1

Using a background image for -webkit-scrollbar-thumb:vertical. Here's a jsFiddle: http://jsfiddle.net/6ESpj/2/

To simulate problem, increase the height in div.inner from 1500px to 2000px. You should see that the bottom get's cut off (I believe this is the equiv of the scrollbar 'shortening' in height as the page content grows).

Can anyone recommend a solution? Even a javascript one if necessary.

Thanks!

BoltClock
  • 700,868
  • 160
  • 1,392
  • 1,356
elzi
  • 5,442
  • 7
  • 37
  • 61

1 Answers1

2
::-webkit-scrollbar-thumb:vertical
{
    background:black url('http://i.minus.com/jbcOb9d7Bb1p6Y.png') no-repeat;
    background-size:26px 63px;  
    background-position:;
    display: block;
    width: 30px;
    height: 100px;
}

Try this, change height of this to whatever you want, if you wish you can with JS compute proper height, something like: height_of_::-webkit-scrollbar-thumb:vertical = height_of_div / SOME_CONSTANT... but I think that isn't necessary.

Kamil
  • 1,633
  • 2
  • 21
  • 24