文章/答案/技术大牛

发布

社区首页 >问答首页 >如何移动Web浏览器滚动条并设置其样式(CSS)？

问如何移动Web浏览器滚动条并设置其样式(CSS)？
EN

Stack Overflow用户

提问于 2010-05-24 04:17:57

回答 4查看 3.6K关注 0票数 2

在访问我目前正在工作的网站时，你会立即注意到，当你滚动浏览博客帖子时，浏览器顶部的一个栏会跟着你往下走。我想知道有没有什么方法可以用来将滚动条移到条的下方而不是它的旁边，然后根据网站的风格设置条的样式。

图片：

css

scrollbar

回答 4

Stack Overflow用户

回答已采纳

发布于 2010-05-24 04:39:49

您可以使用jquery和一些javascript来移动滚动条。在这个例子中，我使用jquery动画来逐渐向下滚动：

//move the scroll 800 pixels down in 200 milliseconds
$('html,body').animate({scrollTop: 800}, 200, "swing");

为了设置滚动条的样式，您可以使用以下css：

body {
  scrollbar-face-color: #FDCF66;
  scrollbar-highlight-color: #FDCF66;
  scrollbar-3dlight-color: #FDCF66;
  scrollbar-darkshadow-color: #FDCF66;
  scrollbar-shadow-color: #FDCF66;
  scrollbar-arrow-color: #FDCF66;
  scrollbar-track-color: #FDCF66;
}

这就是这些颜色的含义(source)：

我不确定这是不是标准的CSS，所以一些导航器可能不支持它。

票数 3

Stack Overflow用户

发布于 2010-05-24 04:23:56

不，您将无法设置工具栏的样式，因为它属于浏览器，而不是网站本身。

票数 2

Stack Overflow用户

发布于 2010-05-24 04:26:41

您可以使用跨浏览器的设置滚动条的样式，但是您不能移动它，它会根据页面的分辨率和结构自动调整。

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/2893282

复制

相似问题

问如何移动Web浏览器滚动条并设置其样式(CSS)？
EN

回答 4

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何移动Web浏览器滚动条并设置其样式(CSS)？EN

回答 4

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何移动Web浏览器滚动条并设置其样式(CSS)？
EN