先上代码:JSFiddle。
这次的话题的希望是能够在 无脚本环境 下实现完美横向滚动。追求无脚本对提高站点的可访问性有极大帮助,例如,站点位于不受信任列表中的时候仍然可以访问大多数功能。
单纯设置 overflow-x: scroll; overflow-y: hidden;
似乎不够。
于是主要就是解决上下滚动的问题,如果有 JavaScript 这是很简单的。如果要避开 JavaScript ,一个思路是对内容做两次反射,但是滚动条只做一次反射,也就是最开始的代码,这可以实现在 Edge 14 上每个访问方式都是正常的,但是问题是在 iOS Safari 上会导致触控访问不正常——上下移动手指会导致内容左右滚动。
于是看起来山重水复疑无路了,我又听说使用 Shift+滚轮 似乎就可以改变滚动方向,求证实或证否!
这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。
V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。
V2EX is a community of developers, designers and creative people.