减慢滚动速度

Question

好的，我找不到关于这个的任何信息。

我知道改变网站的滚动速度很糟糕，但我需要为一个更像游戏而不是网站的网站做这件事。

有人可以告诉我如何减慢滚动速度吗？使用Jquery还是CSS？

编辑：我想在人们使用鼠标滚轮滚动时改变滚动速度。

- David Hakkert

---

你的意思是当使用鼠标滚轮向下滚动时？ - Alex Char

请查看此插件：http://areaaperta.com/nicescroll/ - Amit Soni

你写了什么代码？有做过任何研究吗？你的问题出在哪里？ - Roko C. Buljan

Answer 1

看这个fiddle：http://jsfiddle.net/promatik/NFk2L/，你可以设置时间和距离！

JS代码

if (window.addEventListener) window.addEventListener('DOMMouseScroll', wheel, false);
window.onmousewheel = document.onmousewheel = wheel;

function wheel(event) {
    var delta = 0;
    if (event.wheelDelta) delta = event.wheelDelta / 120;
    else if (event.detail) delta = -event.detail / 3;

    handle(delta);
    if (event.preventDefault) event.preventDefault();
    event.returnValue = false;
}

function handle(delta) {
    var time = 1000;
    var distance = 300;

    $('html, body').stop().animate({
        scrollTop: $(window).scrollTop() - (distance * delta)
    }, time );
}

if (window.addEventListener) window.addEventListener('DOMMouseScroll', wheel, false);
window.onmousewheel = document.onmousewheel = wheel;

function wheel(event) {
  var delta = 0;
  if (event.wheelDelta) delta = event.wheelDelta / 120;
  else if (event.detail) delta = -event.detail / 3;

  handle(delta);
  if (event.preventDefault) event.preventDefault();
  event.returnValue = false;
}

function handle(delta) {
  var time = 1000;
  var distance = 300;

  $('html, body').stop().animate({
    scrollTop: $(window).scrollTop() - (distance * delta)
  }, time);
}

#myDiv {
  height: 800px;
  width: 100px;
  background-color: #CCF;
  font-family: 'Trebuchet MS';
  font-size: 12px;
  line-height: 24px;
  padding: 5px;
  margin: 5px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div id="myDiv">
  Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor
  in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</div>

- Matteo Codogno

---

嗨，当我尝试你的演示时，当我滚动时它变得很奇怪...太慢了，然后非常快，有延迟。 - TOPKAT

Answer 2

NiceScroll插件

jQuery

$(document).ready(function() { 

    $("html").niceScroll();

  }

);

- Amit Soni

---

哪个jQuery版本？ - Võ Minh

不要使用NiceScroll，它在iOS上无法工作。 - Beny

Answer 3

https://github.com/nathco/jQuery.scrollSpeed

演示

你可以在这段代码中加入speed值。

- anu g prem

Answer 4

只需前往控制面板中的Windows鼠标属性，您就可以设置每次滚动浏览的页面数量。

- Sney

---

我不明白你的回答。你是指改变我的电脑设置吗？因为如果是这样的话，那是行不通的，因为每台电脑的滚动速度都应该不同的;) - David Hakkert

OP需要在网站上控制它。 - The One and Only ChemistryBlob