Ver Mensaje Individual
  #1 (permalink)  
Antiguo 19/02/2011, 18:10
vrael
 
Fecha de Ingreso: mayo-2007
Mensajes: 200
Antigüedad: 17 años, 5 meses
Puntos: 1
Leer propiedad CSS

Estoy intentando leer un atributo CSS con javascript, pero no sé que estoy haciendo mal, porque no lo consigo. Por alguna razón puedo modificar su valor, pero no leerlo de primeras.

Código Javascript:
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11-strict.dtd">
  2. <html xmlns="http://www.w3.org/199/xhtml">
  3. <head>
  4.     <style type="text/css">
  5.         .ventana{
  6.             height: 400px;
  7.             width: 30%;
  8.             margin:1%;
  9.             position: absolute;
  10.             border: 2px black double;
  11.             cursor: move;
  12.             z-index: 0;
  13.         }
  14.         #ventana_1{
  15.             top: 123px; left: 225px;
  16.             background-color: red;
  17.         }
  18.         #ventana_2{
  19.             top: 5px; left: 25px;
  20.             background-color: green;
  21.         }
  22.         #ventana_3{
  23.             top: 200px; left: 45px;
  24.             background-color: blue;
  25.         }
  26.         #ventana_4{
  27.             top: 55px; left: 55px;
  28.             background-color: yellow;
  29.         }
  30.     </style>
  31.     <script type="text/javascript">
  32.         //Pinchas sobre un objeto y te devuelve su id
  33.         function BuscarID(evt)
  34.         {
  35.             var ID = (evt.target)? evt.target.id : ((evet.srcElement)? evt.srcElement.id : null);
  36.             //if(ID) alert('Clickeaste sobre: ' + ID);
  37.             return ID;
  38.         }
  39.         //Buscar posición CSS
  40.         function Posicion(evt)
  41.         {
  42.             var ID = BuscarID(evt);
  43.             var Objeto = document.getElementById(ID);
  44.             //alert(Objeto.style.top = '200px');
  45.             var top = Objeto.style.top;
  46.             alert(top);
  47.             //alert('Posición: TOP = ' + Objeto.style.height + 'LEFT = ' + Objeto.sytle.width);
  48.             return;
  49.         }
  50.     </script>
  51.    
  52.     <title>DIV</title>
  53. </head>
  54. <body>
  55.     <div id="ventana_1" class="ventana" onclick = "Posicion(event)">VENTANA 1</div>
  56.     <div id="ventana_2" class="ventana" onclick = "Posicion(event)">VENTANA 2</div>
  57.     <div id="ventana_3" class="ventana" onclick = "Posicion(event)">VENTANA 3</div>
  58.     <div id="ventana_4" class="ventana" onclick = "Posicion(event)">VENTANA 4</div>
  59. </body>
  60. </html>
__________________
Blog: http://a-dream-of-dragon.blogspot.com