Reputation: 1043
I'd like to know if there's a way to trigger events on 2 div at the same time on mouse over in javascript/jquery if they are both at the same location but on different z-index ?
example :
like in this example http://imageshack.com/a/img849/8684/k8jn.jpg
Upvotes: 0
Views: 227
Reputation: 2125
Listen "mousemove" event in wrapper div,
use event object pageX and PageY to find Cursor above both div or not.
Fiddle: http://jsfiddle.net/aslancods/9f4mr/23/
Upvotes: 1
Reputation: 74420
Consider to use elementFromPoint()
method:
DEMO jsFiddle {be aware of bug if using wrapped iframe and scolling body's 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);
});
Original Post: https://stackoverflow.com/a/14416567/1414562
Upvotes: 2