javascript - 鼠标悬停时同时在 2 个 div 上发生事件

标签 javascript jquery html z-index mouseover

我想知道是否有办法在 javascript/jquery 中鼠标悬停时同时触发 2 个 div 上的事件(如果它们位于同一位置但 z 索引不同)?

示例:

like in this example http://imageshack.com/a/img849/8684/k8jn.jpg

最佳答案

考虑使用elementFromPoint()方法:

DEMO jsFiddle {如果使用包装的 iframe 和 scolling body 的 iframe,请注意错误}

$divs = $("#one, #two").on('click.passThrough', function (e, ee) {
   var $el = $(this).hide();
  try {
    if (!ee) $("#msg").empty();
    $("<div/>").append($el.text()).appendTo($("#msg"));      
    ee = ee || {
      pageX: e.pageX,
      pageY: e.pageY
    };
    var next = document.elementFromPoint(ee.pageX, ee.pageY);
    next = (next.nodeType == 3) ? next.parentNode : next //Opera
    $(next).trigger('click.passThrough', ee);
  } catch (err) {
    console.log("click.passThrough failed: " + err.message);
  } finally {
    $el.show();
  }
    alert('div cliked: #' + this.id);
});

原帖:https://stackoverflow.com/a/14416567/1414562

关于javascript - 鼠标悬停时同时在 2 个 div 上发生事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22129159/

相关文章:

javascript - AngularJS:在 ng-model 执行之前触发东西

javascript - 基于配置的Webpack多重 bundle

Jquery: $ ('<div>' ,{sort:x}) 不起作用; 'sort' 属性有什么用?

javascript - 如何更改子组件 HTML

jquery - 流量比较条形图

jquery - 通过 AJAX 和 Rails 重新生成并引入新的 CSRF token

javascript - 如何使用jquery keyup方法设置时间?

html - 让左边的 div 占用剩余的宽度而不交换元素

javascript - 闲置时自动保存表格

javascript - 防止 jquery 浏览器点击时滚动到顶部