Question

我的主页设计有一个问题。问题是我不想要浏览器提供的滚动条。我已经创建了自己的滚动条，所以请告诉我如何做到这一点？

我可以使用jQuery吗？
我可以通过HTML执行此操作吗？

Answer 1

滚动条的样式不是任何标准的一部分，它在不同的浏览器中实现不同。因此，您需要使用一些JavaScript代码来确保您的样式在浏览器中一致地应用。查看jScrollPane，一个jQuery插件。

Answer 2

我明白了

body {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 10px;
    overflow-y: auto;
    overflow-x: hidden;
}


html {
    overflow-y: auto;
    background-color: transparent;
}


::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}


::-webkit-scrollbar-button:start:decrement,
::-webkit-scrollbar-button:end:increment {
    height: 30px;
    display: block;
    background-color: transparent;
}



::-webkit-scrollbar-track-piece {
    background-color: #3b3b3b;
    -webkit-border-radius: 6px;
}


::-webkit-scrollbar-thumb:vertical {
    height: 50px;
    background-color: #666;
    border: 1px solid #eee;
    -webkit-border-radius: 6px;
}

Answer 3

您可以change the color settings of the browser's scrollbar或限制页面中元素的内容，并创建一个Javascript脚本（可能使用jQuery），以便在内容溢出时导航该元素。

后面的Google search包含许多应该能够为您提供帮助的教程。

想用我自己的浏览器滚动条替换

3 个答案: