Este tutorial est?asado en un c?o recogido en las news de Macromedia en Castellano. Su objetivo no es m?que dar al usuario la posibilidad de elegir al usuario el aspecto que m?le agrade de nuestra web

Este tutorial est?asado en un c?o recogido en las news de Macromedia en Castellano. Su objetivo no es m?que dar al usuario la posibilidad de elegir al usuario el aspecto que m?le agrade de nuestra web.

Para esto, contamos con los siguientes 3 estilos, que guardaremos cada uno como un estilo diferente.

hoja1.css

body {
 background-color: #CCCCCC;
 margin-left: 10px;
 margin-top: 10px;
 margin-right: 10px;
 margin-bottom: 10px;
}
#cuerpo {
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 10pt;
  font-weight: normal;
  color: #000000;
  text-decoration: none;
  text-align:justify;
  padding:10px;
 }
#tabla {
 background-color: #FFFFFF;
 border: 1px solid #000000;
 height: 100%;
 width: 700px;
}

hoja2.css

body {
 background-color: #CC9966;
 margin-left: 10px;
 margin-top: 10px;
 margin-right: 10px;
 margin-bottom: 10px;
}
#cuerpo {
  font-family:”Times New Roman”, Times, serif;
  font-size: 12pt;
  font-weight: normal;
  color: #CC6633;
  text-decoration: none;
  text-align:justify;
  padding:10px;
 }
#tabla {
 background-color: #FFCC99;
 border: 1px solid #CC6633;
 height: 100%;
 width: 700px;
}

hoja3.css

body {
 background-color: #CCFFCC;
 margin-left: 10px;
 margin-top: 10px;
 margin-right: 10px;
 margin-bottom: 10px;
}
#cuerpo {
  font-family:”Courier New”, Courier, mono;
  font-size: 12pt;
  font-weight: normal;
  color: #003300;
  text-decoration: none;
  text-align:justify;
  padding:10px;
 }
#tabla {
 background-color: #99CC99;
 border: 1px solid #336600;
 height: 100%;
 width: 700px;
}

Ahora debemos tener nuestras 3 hojas de estilo integradas entre las etiquetas de nuestro documento.

La diferencia entre estos 3 estilos incluidos, es el atributo “rel”, que es la que establece el css activo. Si nos fijamos en el c?o, el estilo principal es rel=”stylesheet”, mientras que el resto, que permanece inactivo aparece como rel = “alternate stylesheet”.

Necesitamos entonces, un script que nos permita alternar las hojas de estilo.

 1
 2 function setActiveStyleSheet(title) {
 3 var i, a, main;
 4 for(i=0; (a = document.getElementsByTagName(“link”)[i]); i++) {
 5 if(a.getAttribute(“rel”).indexOf(“style”) != -1 && a.getAttribute(“title”)) {
 6 a.disabled = true;
 7 if(a.getAttribute(“title”) == title) a.disabled = false;
 8 }
 9 }
 10 }
 11

De esta forma, solo nos queda armar un documento con el script, las 3 hojas de estilo linkadas, y 3 peque?enlaces que utilicen esta funci?ara conseguir el efecto deseado. La p?na podr?quedar algo as?/p>

 1
 2
 3
 4
 5 function setActiveStyleSheet(title) {
 6 var i, a, main;
 7 for(i=0; (a = document.getElementsByTagName(“link”)[i]); i++) {
 8 if(a.getAttribute(“rel”).indexOf(“style”) != -1 && a.getAttribute(“title”)) {
 9 a.disabled = true;
 10 if(a.getAttribute(“title”) == title) a.disabled = false;
 11 }
 12 }
 13 }
 14
 15
 16
 17
 18
 19
 20
 21
 22
 23 A   A   A 
 24
 25
 26

Para lograr el ?to, los profesionales de negocios deben comunicarse con sus colegas, clientes y socios con frecuencia, mantenerlos al d?con el contenido y darles informaci?orrecta. El Macromedia Web Publishing System le da a los colaboradores de contenido una forma f?l y no t?ica de publicar documentos y actualizaciones en sitios web externos e intranet. Cada usuario comercial tendr?na copia con licencia de Macromedia Contribute 3 para la actualizaci?e contenido web y la publicaci?e documentos.

 27
 28

Macromedia Contribute 3 ofrece la sencillez de apuntar y hacer clic a los usuarios de negocios, combinando una interfaz de usuario conocida con una estrecha integraci?on Microsoft Office para maximizar la productividad de la publicaci?p>
 29
 30
 31  32

Ahora solo nos queda disfrutar del script, adapt?olo a nuestras necesidades