Question

我正在处理HTML格式的文档，我想修改ScrollBar的行为，当您滚动它时，会将您发送到文档的特定位置。

Answer 1

您可以尝试捕获滚动事件并更新顶部位置，但您无法直接修改滚动条，因为该元素在许多浏览器中由操作系统呈现，并且JavaScript没有与之通信的API - 你可以说你想要一个带有元素的滚动条和哪些（垂直，水平，两者或没有），就是这样。

使用CSS3，事情开始变得更好，但似乎只支持Webkit：http://cssdeck.com/labs/css3-webkit-vertical-scrollbars/

另见：

Answer 2

为此你必须使用javascript。 jQuery（javascript库）可以帮助您构建.on('scroll')和.scrollTop()

等功能。

由于你的问题不清楚何时滚动，我试图做一个易于理解的例子。聆听窗口滚动位置，当它从顶部到达3000px时，它会从顶部返回到位置800px。如果你想尝试玩它。别忘了包含jQuery！如需帮助，请发表评论。

＆＃13;

$( window ).scroll(function() {
  $( ".show-position" ).html($(window).scrollTop());
  
  if(3000 < $(window).scrollTop()) {
    $("html, body").scrollTop(800);
  }
  
});

＆＃13;

.show-position {
  position: fixed;
  left: 10px; top: 10px;
}

.high-content {
  height: 100000px;
  background-color: orange;
}

.scroll-to {
  position: absolute;
  top: 800px; left: 200px;
  width: 200px; height: 200px;
  border: dashed 5px red;
  font-size: 28px;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="show-position">start scrolling</div>
<div class="high-content"></div>
<div class="scroll-to">I'm positioned 800px from top.</div>

＆＃13;

如何修改ScrollBar的行为？

2 个答案: