Obtener propiedades CSS con javascript varias veces

[danyof]

Buenas. Estoy teniendo problemas a la hora de modificar propiedades de estilo CSS con javascript.

Por ejemplo:

Quiero que al hacer click sobre un cuadro de texto este se desplace un pixel hacia arriba, de modo que tengo esto:

Código:

input{position:relative; top:0px;}
...
...

<input type="text" onclick="subir(this);">

...
...


subir(objeto)
{
altura=objeto.style.top;
altura=altura.substring(0,1); /*esto lo hago para quitar las letras px de la altura */
altura=altura-1;
objeto.style.top=altura+"px";
}

Hasta aqui todo perfecto, consigo que se suba, pero al volver a hacer click no entiendo por que la funcion ya no consigue leerme el valor de la posicion del cuadro de texto apareciendome NaN... como que no estuviera definida.

¿Por que pasa esto?
¿como puedo solucionarlo?

[Tecna]

Buenas,

el método substring es para cadenas y lo que estás haciendo es extraer el primer caracter de la cadena, que en el primer caso es un 0 y por eso funciona, pero al restar uno el primer caracter sería el - y por eso te aparece NaN. Lo que tienes que hacer es usar parseInt( ) para hacer la conversión a número.

[danyof]

Muchas gracias por tu respuesta. Pues si, tendra que ser ese el problema.

Ahora lo que hare, que es lo que en realidad quiero es, que se suba un pixel cuando reciba el foco, y que baje otro pixel cuando lo pierda... aunque con parseInt no creo que tenga problemas.

Muchas gracias!

[Adler]

Hola

Corrige el substring

Fijate en esto

Código Javascript:

var str1="5px";
var str2="55px";
var str3="555px";
pos1 = str1.indexOf("px");
pos2 = str2.indexOf("px");
pos3 = str3.indexOf("px");
document.write(str1.substring(0,pos1)+"<br />");
document.write(str2.substring(0, pos2)+"<br />");
document.write(str3.substring(0, pos3)+"<br />");
 

De esta manera da igual que sean 5, 55 o 555

Suerte

[danyof]

Interesante tecnica... la verdad es que no la habia pensado.

Muy interesante. De momento lo hare con parseInt aunque esta estrategia me valdra seguramente para futuras aplicaciones.

Gracias y un saludo!