[Questioner]

Есть код:

<script>
var deg = 0;
var rot = function(e){
	if (e.keyCode == 37) {// если клавиша "влево"
		deg -= 5;
		deg %= 360;
		document.getElementById('Player').style.MozTransform = 'rotate(' + deg + 'deg' + ')';
		document.getElementById('Player').style.OTransform = 'rotate(' + deg + 'deg' + ')';
		document.getElementById('Player').style.WebkitTransform = 'rotate(' + deg + 'deg' + ')';
	};
	if (e.keyCode == 38) {// если клавиша "вверх"
		document.getElementById("Player").style.top = parseInt(document.getElementById("Player").style.top, 10) - (10 * Math.cos(deg / 180 * Math.PI)) + 'px';
		document.getElementById('Player').style.left = parseInt(document.getElementById('Player').style.left, 10) + (10 * Math.sin(deg / 180 * Math.PI)) + "px";
	}
	if (e.keyCode == 39) {// если клавиша "вправо"
		deg += 5;
		document.getElementById('Player').style.MozTransform = 'rotate(' + deg + 'deg' + ')';
		document.getElementById('Player').style.OTransform = 'rotate(' + deg + 'deg' + ')';
		document.getElementById('Player').style.WebkitTransform = 'rotate(' + deg + 'deg' + ')';
	}
	if (e.keyCode == 40) {// если клавиша "вниз"
		document.getElementById("Player").style.top = parseInt(document.getElementById("Player").style.top, 10) + (10 * Math.cos(deg / 180 * Math.PI)) + 'px';
		document.getElementById('Player').style.left = parseInt(document.getElementById('Player').style.left, 10) - (10 * Math.sin(deg / 180 * Math.PI)) + "px";
	}
}
window.onload = function() {
	document.addEventListener("keydown", rot, false);	
}
</script>
<div ID = "Player" style = "-moz-transform: rotate(0deg);-o-transform: rotate(0deg);-webkit-transform: rotate(0deg); position: absolute; left: 100px; top: 100px; border: 1px solid black">
^
</div>

В принципе, все работает, но почему на "Вверх" и "Вниз" в left другой чем в top знак (+/-)?
И как отслеживать и кноаку "вверх", и кнопку "влево" одновременно?