Set element position with CSS style left and top - Javascript CSS Style Property

Javascript examples for CSS Style Property:left

  1. HOME
  2. Javascript
  3. CSS Style Property
  4. left

Description

Set element position with CSS style left and top

Demo Code

ResultView the demo in separate window 

<html>
   <head> 
      <script type="text/javascript">
function showCoords(evt){//  w  ww .  j ava  2s .c  om
  document.getElementById("character").style.left = evt.pageX;
  document.getElementById("character").style.top = evt.pageY;
}

      </script> 
   </head> 
   <body onmousedown="showCoords(event)"> 
      <div id="character" style="position: absolute; top: 100px; width: 80px; height: 40px; background:black;">
          Char 
      </div>  
   </body>
</html>

Related Tutorials