Detecting if the browser window is moved with JavaScript?

Question

This is for a demo... and i was just curious, can you detect if the window has been moved? Like if you move Firefox/Chrome/IE around your monitor? I doubt it, but I wanted to see since you can check for resize and focus/blurred windows.

Answer 1

I can only think of this (heavy) work-around, where you check if window.screenX and window.screenY have changed every x milliseconds

var oldX = window.screenX,
    oldY = window.screenY;

var interval = setInterval(function(){
  if(oldX != window.screenX || oldY != window.screenY){
    console.log('moved!');
  } else {
    console.log('not moved!');
  }

  oldX = window.screenX;
  oldY = window.screenY;
}, 500);

Though I would not recommend this -- it might be slow and I'm not sure if screenX and screenY are supported by all browsers

Answer 2

A potentially more optimised version of this is to only check for window movement when outside of the window combined with Harmen's answer:

var interval;
window.addEventListener("mouseout", function(evt){ 
  if (evt.toElement === null && evt.relatedTarget === null) {
    //if outside the window...
    if (console) console.log("out");
    interval = setInterval(function () {
      //do something with evt.screenX/evt.screenY
    }, 250);
  } else {
    //if inside the window...
    if (console) console.log("in");
    clearInterval(interval);
  }
});

If using jQuery, it may normalise screenX/Y in this case so it's worth running a few tests on that. Jquery would use this format instead of addEventListener:

$(window).on('mouseout', function () {});

If you are moving the window in Windows OS via alt + Space, and find that windows resizes are ignored, I would recommend adding an extra level of detection via keypress events.