Como hago Para Modificar atributos en style por X Segundos [javascript]

ahmad · #1 (**permalink**) 02/07/2011, 19:58

Hola

Eh conseguido este Codigo, que por medio de Clicks modifico atributos en mi archivo style.

Código:

<a href="javascript:void(0);" 
    onclick="document.getElementById('nombreContenedor').style.display='block';
      document.getElementById('nombreContenido').style.display='block';">
ENLACE ABRIR
</a>

Pero quiero que esos 2 atributos se modifiquen solos, ya sea auto arranque ó se automodifican a los X segundos.

Navegano por ahi consigue este codigo

Código:

setTimeout( "alert('Hello')", 5000 );

que creo que puedo hacerlo modificar en 5 segundos

por medio de esto:

hacerlo esto:

Código:

setTimeout( "CambiaEstilo", 5000 );

luego modifico esto

Código:

function CambiaEstilo(obj,tam,atrib){
		var obj = document.all ? document.all[obj] :
                document.getElementById(obj);
		if (atrib=="size")
		   obj.style.height=tam;
		if (atrib =="top")
		    obj.style.top=tam;
		}

Pero no eh conseguido resultados.. como Hago?

Panino5001 · #2 (**permalink**) 03/07/2011, 04:56

A ver si te sirve:

Código PHP:

  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>Documento sin título</title>

<script type="text/javascript">

function CambiaEstilo(obj,tam,atrib){

        var obj = document.getElementById(obj);//quitamos el resto: no necesitamos retrocompatibilidad con explorer 4, ¿no?

        if (atrib=="size")

           obj.style.height=tam;

        if (atrib =="top")

            obj.style.top=tam;

}

//nos aseguramos de que todos los elementos hayan sido reconocidos por el navegador antes de invocarlos (onload)

onload=function(){

    /*

    -como hay que definir argumentos en la función temporizada, la envolvemos en una función anónima

    -notar que el segundo argumento tiene la unidad px, porque si no hay navegadores que no mostrarán el cambio

    */

    setTimeout( function(){CambiaEstilo('pp','1000px','size');}, 5000 );

}

</script>

 
</head>

 
<body>

<div id="pp" style="width:300px; height:50px; background:#F00;"></div>

</body>

</html>

ahmad · #3 (**permalink**) 03/07/2011, 19:12

Muchas Gracias.. Me tomo tiempo saver donde modificar, pero lo logre:)

el Codigo que deje alfinal

Código PHP:

  <script type="text/javascript">

function CambiaEstilo(obj,tam,atrib){
        var obj = document.getElementById(obj);//quitamos el resto: no necesitamos retrocompatibilidad con explorer 4, no?
        if (atrib=="block1")
           obj.style.display=tam;
        if (atrib =="block2")
            obj.style.display=tam;
}
//nos aseguramos de que todos los elementos hayan sido reconocidos por el navegador antes de invocarlos (onload)
onload=function(){
    /*
    -como hay que definir argumentos en la funcin temporizada, la envolvemos en una funcin annima
    -notar que el segundo argumento tiene la unidad px, porque si no hay navegadores que no mostrarn el cambio
    */
    setTimeout( function(){CambiaEstilo('nombreContenedor','block','block1');}, 3000 );
    setTimeout( function(){CambiaEstilo('nombreContenido','block','block2');}, 3000 );
}
</script>

Gracias :)