En este grupo En todos

Foro de Javascript



Cambiar Estilos con JavaScript

Escrito por Sutil
el 13/01/2009

Con este codigo podemos cambiar todo el estilo de la pagina, es como cambiar de tema hablando de fondo de pantalla, estilo, etc..

Javascript nos permite cambiar las propiedades de un objeto usando la sintaxis objeto. Propiedad=valor así que cambiando la propiedad href de la etiqueta <link> que enlaza los archivos CSS el estilo especificado se cargará.

Primero, crearemos un enlace al estilo CSS por defecto asignándole un identificador :

<link href="css/defecto. Css" rel="stylesheet" type="text/css" id="estilo">

Despues crearemos en Javascript la función que cambiará el estilo. Funciona pasándole como único argumento el nombre o ruta completa del archivo CSS a mostrar. Usaremos la propiedad getElementById() para identificar el objeto:

function estilo(arquivo) {
document. GetElementById("estilo"). Href=arquivo;
}

Y finalmente sólo tendremos que llamar a la función desde un enlace o botón pasándole como argumento el nombre o ruta del arquivo CSS que queramos mostrar:

<input type="buton" value="Cambiar Estilo" onClick="estilo("azul. Css");">

Podemos comprobar el funcionamento del script en la sección Opciones del menú de la derecha.