将图像用于 webkit 滚动条 - -webkit-scrollbar-track-piece 的最小高度? [英] Using image for webkit scrollbar - minimum height for -webkit-scrollbar-track-piece?

问题描述

为 -webkit-scrollbar-thumb:vertical 使用背景图像.这是一个 jsFiddle:http://jsfiddle.net/6ESpj/2/

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

为了模拟问题，将 div.inner 中的高度从 1500 像素增加到 2000 像素.您应该看到底部被切断了(我相信这是滚动条随着页面内容的增长而缩短"的等价物).

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).

谁能推荐一个解决方案?如有必要，甚至可以使用 javascript.

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

谢谢！

推荐答案

::-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;
}

试试这个，把它的高度更改为你想要的任何高度，如果你希望你可以用 JS 计算适当的高度，比如:height_of_::-webkit-scrollbar-thumb:vertical = height_of_div/SOME_CONSTANT ...但我认为这不是必需的.

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.

这篇关于将图像用于 webkit 滚动条 - -webkit-scrollbar-track-piece 的最小高度?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！