Question

Currently, I “do stuff” when the mouse moves. However, I also want to do the exact same thing if the user resizes the browser or scrolls down the browser.
jQuery(document).bind(‘mousemove’,function(e){
var x, y;
x = e.pageX; // x coord
y = e.pageY; // y coord
//other stuff
});

I tried putting doing

jQuery(document).bind('mousemove resize scroll',function(e){...

but it didn’t work. I also tried

jQuery(document, window).bind('mousemove resize scroll',function(e){...

but it also didn’t work.

I also know that you can detect scroll using

$(window).scroll(function(){

and detect resize using

$(window).resize(function() {

But the if I use those detections, I won’t have the “e” argument to get the x and y coordinates of the mouse

How do I bind all 3 events all into one function?

Thanks

Answer 1

You do still have the event data in the scroll and resize methods. Try wrapping your code into a single function with 3 handlers. The on() method requires jQuery 1.7+

function reusable(eData){
    // Heres what you want to do every time
}
$(document).on({
    mousemove: function(e) { reusable(e); },
    scroll   : function(e) { reusable(e); }
);
$(window).on({
    resize   : function(e) { reusable(e); }
});

---

edited

The events should be in their correct objects window and document or you will get unexpected values.