使用鼠标滚轮水平滚动

Question

我正在使用 Chris Coyier 的方法，通过 js 在 div 周围封装表格单元格来实现水平滚动 http://css-tricks.com/how-to-create-a-horizontally-scrolling-site/ 。但是，要滚动，您必须使用水平滚动鼠标或在滚动时按住 shift。

所以，我使用了这个 hscroll.js 插件http://paulicio.us/items/view/24/horizontal-page-scrolling-using-javascript，它可以让您通过鼠标滚轮横向滚动页面。

但在 Firefox 和 Opera 中测试时存在相当大的延迟/不稳定（在 Chrome 和 Safari 中运行良好）。我认为 Brandon Aaron 的 mousewheel.js http://brandonaaron.net/code/mousewheel/docs 将是可行的解决方案，但我不知道如何实现该插件，因为我在 js 方面是文盲。

Jsfiddle：http://jsfiddle.net/694TK/3/

更新： tinyscroll 插件似乎工作正常，只是它没有缓动功能，有什么解决方案吗？：http://jsfiddle.net/694TK/6/

又一次更新： http://jsbin.com/uwehot/
Mary Lou 的循环内容轮播*(http://tympanus.net/codrops/2011/08/16/circular-content-carousel/)* 在这里发挥作用。
它工作得很好，只是锚链接不起作用。

Answer 1

嗯，我认为表格方法不够好。 尝试包装你的段落并将锚链接设置为标题

锚链接将成为动画的起点和终点“标记”。 每次用户开始滚动（该事件将由您的插件触发）时，动画开始并结束到下一个锚点 看example

这家伙使用按钮点击事件来触发他的动画

$('#btn_two').click(function(){
$('.nav').fadeOut("fast").fadeIn("slow");
$.scrollTo(this.hash, 1500, { easing:'elasout' });
});

您将使用鼠标滚轮事件。 虽然这是一种有点暴力的方法 为了在用户滚动时平滑移动，请使用缓动插件