使用 mCustomScrollbar 一次滚动一个元素答案

【问题标题】：scroll one element at a time using mCustomScrollbar使用 mCustomScrollbar 一次滚动一个元素
【发布时间】：2019-04-26 13:35:14
【问题描述】：

如何使用 mCustomScrollbar 确保在滚动元素上一次一个元素。我有以下 html：

<ul>
    <li>A</li>
    <li>B</li>
    <li>C</li>
    <li>D</li>
</ul>

在滚动ul 时，一次只能滚动一个li，即任何元素都不应跳过滚动。

【问题讨论】：

你的意思是在鼠标滚轮上li滚动？
是的，一次一里

标签： jquery mcustomscrollbar

【解决方案1】：

您应该在mouseWheel 对象中使用scrollAmount 属性。

mouseWheel:{ scrollAmount: integer }

设置鼠标滚轮滚动量（以像素为单位）。默认值“auto”根据可滚动内容长度调整滚动量。

$("ul").mCustomScrollbar({
  mouseWheel:{ 
    scrollAmount: 100
  }
});

ul {height: 200px}
li {
  height: 100px;
  border: 1px solid red;
}

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="http://malihu.github.io/custom-scrollbar/jquery.mCustomScrollbar.concat.min.js"></script>
<link rel="stylesheet" href="http://malihu.github.io/custom-scrollbar/jquery.mCustomScrollbar.min.css" />
<ul>
  <li>A</li>
  <li>B</li>
  <li>C</li>
  <li>D</li>
  <li>E</li>
  <li>F</li>
</ul>

【讨论】：