Hola amigos veran estoy desarrollando un pequeño juego hecho en php y javascript, y bueno gracias a la ayuda de algunos usuarios de este foro pude lograr a que un div ( sprite) se desplace
Codigo:
Código PHP:
<html>
<head>
<style type="text/css">
#base-map {
position:absolute;
left:0;
top:0;
width:500px;
height:320px;
z-index:1;
background-color: #CCCCCC;
}
#user-1 {
position:absolute;
left:0px;
top:0px;
width:15px;
height:21px;
z-index:2;
}
#apDiv1 {
position:absolute;
left:514px;
top:18px;
width:103px;
height:85px;
z-index:3;
}
#obstaculo {
position:absolute;
left:32px;
top:32px;
width:16px;
height:21px;
z-index:4;
background-color: #000000;
}
</style>
<script type="text/javascript">
function abajo(){
var posicionActual=document.getElementById("user-1").offsetTop;
posicion = posicionActual + 16;
var abajo = document.getElementById("user-1").style.top=posicion;
}
function arriba(){
var posicionActual=document.getElementById("user-1").offsetTop;
posicion = posicionActual - 16;
var arriba = document.getElementById("user-1").style.top=posicion;
}
function izquierda(){
var posicionActual=document.getElementById("user-1").offsetLeft;
posicion = posicionActual - 16;
var izquierda = document.getElementById("user-1").style.left=posicion;
}
function derecha(){
var posicionActual=document.getElementById("user-1").offsetLeft;
posicion = posicionActual + 16;
var derecha = document.getElementById("user-1").style.left=posicion;
}
</script>
</head>
<body>
<div id="base-map">
<div id="obstaculo"></div>
</div>
<div id="user-1"><img src="http://static4.wikia.nocookie.net/__cb20110104210317/mario/es/images/d/d4/Champi%C3%B1%C3%B3n_M%26LVCB.png" width="16" height="21"></div>
<div id="apDiv1">
<table width="200" border="1">
<tr>
<td> </td>
<td onClick="arriba()">arriba</td>
<td> </td>
</tr>
<tr>
<td onClick="izquierda()">izquierda</td>
<td> </td>
<td onClick="derecha()">derecha</td>
</tr>
<tr >
<td> </td>
<td onClick="abajo()">abajo</td>
<td> </td>
</tr>
</table>
</div>
</body>
</html>
pero ahora lo que quisiera es saber... como puedo hacer para que el obstaculo color negro no se pasar por encima sino por los costados ... 
Gracias de ante mano !