Click and Drag Press and Hold
I really loved today's xkcd, "Click and Drag", but couldn't bring myself to spend that much time on my tiny trackpad, well, clicking and dragging. Never one to demur to the challenge of allowing myself future laziness, I wrote the following code to let me move around the incredible illustrated world with my keyboard. Faking mouse events FTW!
Just copy and paste the code into your browser's JavaScript console to play!
Here's the below code as a bookmarklet: Press and Hold
// get the map element
var el = $('.map')[0];
// amount in pixels we want to move each keypress/hold
var move = 200;
function fakeMouseEvent(type, x, y) {
var evt = document.createEvent("MouseEvents");
evt.initMouseEvent(type, true, true, window,
0, 0, 0, x, y, false, false, false, false, 0, null);
el.dispatchEvent(evt);
}
$(window).keydown(function(e) {
var key = e.which;
if (key >= 37 && key <= 40) {
e.preventDefault();
var left=0, top=0;
if (key == 37) { left += move; }
if (key == 38) { top += move; }
if (key == 39) { left -= move; }
if (key == 40) { top -= move; }
fakeMouseEvent('mousedown', 0, 0);
setTimeout(function() {
fakeMouseEvent('mousemove', left, top);
setTimeout(function() {
fakeMouseEvent('mouseup', left, top);
}, 0);
}, 0);
}
});