8

在 OS X 上的 Safari 中,带有魔术触控板或 macbook 触控板,用两根手指左右滑动分别会产生前后左右的效果。有没有办法检测到这一点,与单击后退/前进或点击命令+箭头等不同?

原因是滑动有它自己的显示风格的滑动动画,并且在网站上使用自定义 ajax 转换,当你让一个跟随另一个时看起来真的很奇怪。例如,在 github 上浏览代码时会发生这种情况。

23/6/16 更新:Github 恢复为简单地交换页面内容而没有过渡,这是一个聪明的举动。我目前的做法是对后退/前进做同样的事情,即使网站上使用了某种花哨的过渡。这可以防止浏览器可能执行的任何操作与站点转换之间的冲突

4

2 回答 2

9

您可以使用鼠标滚轮事件来查看在您的 popstate 事件之前是否已在触控板上执行了水平滚动:

// boolean that stores if a swipe has been performed.
var bScrolled = false;
// countdown in ms before resetting the boolean.
var iTime = 1000;
var oTimeout;
window.addEventListener('mousewheel', function(e) {
  if (e.wheelDeltaY === 0) {
  // there is an horizontal scroll
    if (!bScrolled) {
    // no need to set bScrolled to true if it has been done within the iTime time. 
      bScrolled = true;
      oTimeout = setTimeout(function(){
        bScrolled = false;
      }, iTime);
    }
  }
});

window.onpopstate = function() {
  // clear the timeout to be sure we keep the correct value for bScrolled
  clearTimeout(oTimeout);
  // check if there has been a swipe prior to the change of history state
  if (bScrolled) {
    // check which browser & OS the user is using, then
    // trigger your awesome custom transition.
  }
}
于 2013-10-03T16:18:22.903 回答
-2

一句话,没有。滑动被写入 OS X 后面的 UNIX 代码和 Safari 浏览器的代码中。然后浏览器识别手势并将其解释为后退/前进按钮。

也就是说,您可能会编写一些代码来识别页面上具有特定速度的滚动,然后触发您的代码,但您总是会与浏览器的预编码后退/前进按钮识别竞争。据我所知,您无法从 HTML(或任何其他语言)中修改浏览器。

于 2012-06-29T18:10:40.000 回答