触控设备中的鼠标悬停效果

Question

我正在尝试弄清楚如何在触摸设备中实现“鼠标悬停”效果。

我创建了这个简单的示例来演示我正在寻找的行为。

$( document ).ready(function() {
    isDown = false;

    $('#rect1').on('touchstart mousedown', function(e) {
        e.stopPropagation();
        e.preventDefault();

        isDown = true;

        $(this).css({"background-color":"red"});
    });

    $(document).on('touchend mouseup', function(e) {
        e.stopPropagation();
        e.preventDefault();

        isDown = false;

        $('#rect1').css({'background-color':'grey'});
        $('#rect2').css({'background-color':'grey'});
    });

    $('#rect2').on('touchmove mouseover', function(e) {//.hover(function() {
        if (isDown) {
            $(this).css({"background-color":"red"});
        }
    });
});

http://jsfiddle.net/mE9Ug/

我想在移动设备（触摸设备）上实现相同的行为。

如您所见（在示例中），touchmove 不起作用。我还尝试了 jquery mobile 的 vmouseover，但效果不佳。

如果有人有任何想法，我真的很感激！

谢谢， 阿萨夫

Answer 1

iOS 设备上有一个技巧：http://www.codediesel.com/javascript/making-mouseover-event-work-on-an-ipad/