Update:
Here's a better version; I merged the keyboard and scroll code into the same event for you:
if (document.addEventListener) {
// IE9, Chrome, Safari, Opera
document.addEventListener("mousewheel", walk, false);
// Firefox
document.addEventListener("DOMMouseScroll", walk, false);
}else{
// IE 6/7/8
document.attachEvent("onmousewheel", walk);
}
function walk(e) {
var e = window.event || e; // old IE support
if (e.keyCode) {
//keyboard input
if (e.keyCode === 39) {
key.right = true;
} else if (keyCode === 37) {
key.left = true;
}
}else{
//scroll input
var delta = Math.max(-1, Math.min(1, (e.wheelDelta || -e.detail)));
if (delta == 1) {
//walk right
key.right = true;
key.left = false;
}else if (delta == -1) {
//walk left
key.left = true;
key.right = false;
}else{
//stop
key.left = false;
key.right = false;
sprite.classList.remove('walk-right');
sprite.classList.remove('walk-left');
}
}
if (key.right === true) {
trans += 0;
translate();
sprite.classList.remove('left');
sprite.classList.add('right');
sprite.classList.add('walk-right');
} else if (key.left === true) {
trans -= 0;
translate();
sprite.classList.remove('right');
sprite.classList.add('left');
sprite.classList.add('walk-left');
}
}
Previous answer:
Here you go:
if (document.addEventListener) {
// IE9, Chrome, Safari, Opera
document.addEventListener("mousewheel", scroll, false);
// Firefox
document.addEventListener("DOMMouseScroll", scroll, false);
}else{
// IE 6/7/8
document.attachEvent("onmousewheel", scroll);
}
function scroll(e) {
var e = window.event || e; // old IE support
var delta = Math.max(-1, Math.min(1, (e.wheelDelta || -e.detail)));
if (delta == 1) {
//walk right
key.right = true;
key.left = false;
}else if (delta == -1) {
//walk left
key.left = true;
key.right = false;
}else{
//stop
key.left = false;
key.right = false;
sprite.classList.remove('walk-right');
sprite.classList.remove('walk-left');
}
if (key.right === true) {
trans += 0;
translate();
sprite.classList.remove('left');
sprite.classList.add('right');
sprite.classList.add('walk-right');
} else if (key.left === true) {
trans -= 0;
translate();
sprite.classList.remove('right');
sprite.classList.add('left');
sprite.classList.add('walk-left');
}
}