2 行 JS 代码实现页面横向滚动特效

作者 | 峰华 责编 | 梦依丹

出品 | 峰华的个人博客

在前端这个无奇不有的世界里，有些网站不是正常垂直滚动的，而是横向滚动的：

那么在没法把鼠标滚轮横过来的前提下（苹果除外），能否实现网页横向滚动呢？我们来写代码试试。先看一下最终效果，这里我用鼠标的滚轮垂直滚动，页面是横向滚动的。

要实现这个功能，只需要一点点的 JS 代码。

编写 HTML 结构

先看一下 HTML 结构，很简单，就是三个模拟全屏页面的 div，class 都是 page，然后放在一个 class 名为 container 的 div 容器中：