Question

您好我正在努力解决以下问题

我已经敲了一些样品试图展示我想要做的事情。

我想要发生的是当红线越过蓝线时获取红线数据属性注释。

我正在尝试使用最近的jquery来检测最接近的div，如下所示。

var count = 1; 
setInterval(function(){

    leftPixels = count++;
    console.log(leftPixels);
    $('.scruber').css('left','-' + leftPixels * 10 + 'px');

    var markerData = $('.eventLine').closest('.marker').data('comment');

    $('.output').html(markerData);
    console.log(markerData);

},1000);

真的很感激这方面的帮助

由于

Answer 1

您可以使用document.elementFromPoint（x，y）执行此操作; 这是一个例子。

在Chrome上测试：

http://jsfiddle.net/4F4f8/18/

var getElementBelowMe = function($me) {
    var $below,
        elOffset = $me.offset(),      
        x        = elOffset.left + $me.width() / 2,
        y        = elOffset.top + $me.height() / 2;

    $me.css("visibility", "hidden");
    $below = document.elementFromPoint(x, y);
    $me.css("visibility", "");
    return $below;
}

var count = 1; 
setInterval(function(){

    leftPixels = count++;
    var scruber = $('.scruber');
    scruber.css('left','-' + leftPixels * 10 + 'px');

    var eventLine = $('.eventLine');

    var markerData = getElementBelowMe(eventLine);
    if(markerData && $(markerData).hasClass("marker")) {
        var txt = "Passing " + $(markerData).data("comment");
        console.log(txt);
        $(".output").append(txt + "<br />");
    }

},100);

您必须记住以下几点：

该示例通过查找事件行的中心并检查下面的内容来工作。这适用于您当前的设置，但如果checkPoints更窄，并且eventLine更宽，则可能会失败。
elementFromPoint支持有点不对，或者在不同的浏览器中说不同（http://www.quirksmode.org/blog/archives/2010/06/more_ie9_goodne.html#link2）。
我在示例中使用了可见性，因为display：none，实际上可以改变其他元素的位置，从而提供意想不到的结果，但你可以更好地使用它，测试..
在某些结构中有标记坐标，并检查哪条最接近评论中提出的@Archer可能是更好的解决方案

在jquery中检测两个div是否相互通过

1 个答案: