function scroll(color) {
let scrollStyle = `
<style css-id="scroll">
/* 滚动条 */
/*定义整个滚动条高宽及背景:高宽分别对应横竖滚动条的尺寸*/
::-webkit-scrollbar
{
width:10px;
background-color:#F5F5F5;
}
/*定义滚动条轨道:内阴影+圆角*/
::-webkit-scrollbar-track
{
background-color:#F5F5F5;
}
/*定义滑块:内阴影+圆角*/
::-webkit-scrollbar-thumb
{
border-radius:10px;
background-color:${color};
}
</style>
`
let div = document.createElement("div");
let _scrollNode = document.querySelector("[css-id='scroll']") || null;
if (_scrollNode) {
document.querySelector("head").removeChild(document.querySelector("[css-id='scroll']"));
}
div.innerHTML = scrollStyle;
let newScrollNode = div.querySelector("[css-id='scroll']");
document.getElementsByTagName("head")[0].appendChild(newScrollNode)
}
js动态修改滚动条样式
于 2022-06-11 21:17:32 首次发布