桌面浏览器上的水平 iScroll 问题

Posted 2023-03-14

【中文标题】桌面浏览器上的水平 iScroll 问题

【英文标题】：Horizontal iScroll issues on desktop browsers

【发布时间】：2013-03-12 03:13:39

【问题描述】：

我正在尝试使用 iScroll.js 为桌面网站实现水平滚动。拖动工作正常，样式应用正常，但我发现滚动有问题。

最初我使用 iScroll 4.1.7 鼠标滚轮在 PC 上无法正常工作 在 Mac 上，Chrome 和 Safari 存在阻止本机滚动的问题，特别是如果您的用户激活了触控板首选项：在页面之间滑动，如果您向左（后退）滚动，它会打开上一页。 Firefox 滚动正常 拖动工作正常。

随后尝试v4.2.5： https://github.com/cubiq/iscroll 这在桌面浏览器上似乎根本没有滚动或鼠标滚轮。 拖动效果很好。

这就是我尝试初始化 iScroll 的方式： （这里的文档中定义：http://cubiq.org/iscroll-4）

<script type="application/javascript" src="iscroll.js"></script>
<script type="text/javascript">
var myScroll;
function loaded() 
myScroll = new iScroll('wrapper');

document.addEventListener('DOMContentLoaded', loaded, false);
</script>`

下面是一个演示：

iScroll 4.1.7 http://anything.is/iscroll4-1-7

iScroll 4.2.5 http://anything.is/iscroll4-2-5

如果我做错了什么，或者这些是真正的问题，有什么想法吗？

【参考方案1】：

我真的不知道是否应该默认设置鼠标滚轮选项，但您可以尝试像这样添加它：

function loaded() 
    myScroll = new iScroll('wrapper', 
        wheelHorizontal: true
    );

这是在 Chrome 上使用 iscroll 4.2.2 测试的，这意味着它可能不是完美的解决方案，但看起来确实是一个快速修复。 4.2.5应该可以了！

在这里找到答案：iScroll 4 horizontal mousewheel scroll 页面中有一个jsFiddle你可以查看！希望这会有所帮助。

【讨论】：

我们已经尝试过 wheelAction: 'scroll' （以及其他一些技巧），但是这个动画中没有任何“动量”。这是我们需要的核心功能。