user1023465 user1023465 - 5 months ago 57
jQuery Question

Is there a way to make a mousewheel trigger the "hover" event in Javascript?

By default, if a user uses the mousewheel to scroll down the page, it doesn't trigger any of the hover events. Is there a way to change this so that as long as the pointer is hovering over a div, it will trigger the hover event whether the user used the mouse or the mousewheel to move it there?



$(window).load(function() {
$(document).bind('mousewheel', function(e) {
console.log(e.pageX);
console.log(e.pageY);
var e1 = $.Event('mouseenter');
e1.pageX = e.pageX + 1;
e1.pageY = e.pageY;
$('img').trigger(e1);

var e2 = $.Event('mousemove');
e2.pageX = e.pageX + 1;
e2.pageY = e.pageY;
$('img').trigger(e2);
});
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>





Edit: The above code is triggering a hover event, but it's not selecting any image in particular, it's just triggering hover events on every mouse move.

Answer

This might work:

var x = 0, y = 0;

$(document).bind('mousemove', function(event) {x = event.clientX; y = event.clientY});

$(document).bind('mousewheel', function(e1) {
    var rand = Math.floor(Math.random*2) ? 1 : -1;
    X = x+rand;
    Y = y;
    setTimeout(function() {$("body").trigger($.Event("mousemove", {clientX: X, clientY: Y}));}, 400);
}