Question

我试图弄清楚如何使用touchmove事件模拟iOS上的悬停/鼠标中心功能。

我想在iOS上复制BigGraph悬停效果。如果你不熟悉它，链接在下面。请注意，当您将鼠标悬停在方块上时，它们将展开，然后在移除悬停时折叠。

http://isotope.metafizzy.co/custom-layout-modes/big-graph.html

在BigGraph中，你会注意到悬停在行为上，我试图在触摸设备上复制它。我正在努力想办法让你的手指在屏幕上移动并使盒子展开。由于不支持悬停，我认为触摸移动是一种选择。

我已经能够使用touchstart和touchend事件扩展项目，但似乎touchmove没有办法捕获你正在盘旋的DIV，因此我无法捕获该项目以扩展它。

下面是一个简单的片段，任何想法都将不胜感激。 THX

$(".item").bind("touchstart", function(e){
    log("touch start");
    $(e.currentTarget).find('.icon').css("background-color", "red");
    e.preventDefault();
});

$(".item").bind("touchend", function(e){
    log("touch end");
});

.big-graph .item:hover .icon {
  -webkit-transform: scale(2);
     -moz-transform: scale(3);
      -ms-transform: scale(3);
       -o-transform: scale(3);
          transform: scale(3);
}

Answer 1

我不确定你要用touchmove捕捉到什么。但要模拟扩展和折叠的框的悬停

$('.item').bind('touchstart', function() {
    // expand box
});

$('.item').bind('touchend', function() {
    // collapse
});

我认为你根本不需要触摸，除非我遗漏了什么。也许有一种你想要但没有明确提及的行为？

Answer 2

我不是iOS程序员，但你能以某种方式使用多点触控功能吗？例如，单指触摸是“点击”;双指触摸是“悬停”。或者切换按钮（单击/悬停）。

在多个Div上使用触摸模拟HTML悬停

2 个答案: