Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

VernonLacerda

Jump Menu com estilo

Por , em Javascript

Recommended Posts

Arak    0

Arak
Postado

Saudações....

 

 

<script>function altera(){     if(document.getElementById('muda').value == "um"){     document.getElementById('st').className = "estilo1"         }         else{     document.getElementById('st').className = "estilo2"                }     }</script><body class="estilo" id="st">Texto 1 <br>Texto 2 <br>Texto 3 <br><select id="muda" onChange="altera()"><option value="um">Estilo1</option><option value="dois">Estilo2</option></select></body>

espero que ter ajudado.

Compartilhar este post

Link para o post
Compartilhar em outros sites

VernonLacerda    0

VernonLacerda
Postado

Saudações....

 

 

<script>function altera(){     if(document.getElementById('muda').value == "um"){     document.getElementById('st').className = "estilo1"         }         else{     document.getElementById('st').className = "estilo2"                }     }</script><body class="estilo" id="st">Texto 1 <br>Texto 2 <br>Texto 3 <br><select id="muda" onChange="altera()"><option value="um">Estilo1</option><option value="dois">Estilo2</option></select></body>
espero que ter ajudado.

<{POST_SNAPBACK}>

Tnks. Porém, uma dúvida. Faço isso tb com folha de estilo? Se for assim, onde diz "estilo1" e "estilo2" ponho o nome do arquivo "estilo1.css" e estilo2.css"? É isso?

Compartilhar este post

Link para o post
Compartilhar em outros sites

Arak    0

Arak
Postado

Saudações....isso mesmo, a folha de estilo esta salva na mesma pasta do arquivo .htm.Eu me chamo arquivo somente pelo nome "estilo1", mas acredito que se chamar o arquivo pelo nome completo "estilo1.css", tb deve dar certo.espero ter ajudado.

Compartilhar este post

Link para o post
Compartilhar em outros sites

VernonLacerda    0

VernonLacerda
Postado

Saudações....

 

isso mesmo, a folha de estilo esta salva na mesma pasta do arquivo .htm.

 

Eu me chamo arquivo somente pelo nome "estilo1", mas acredito que se chamar o arquivo pelo nome completo "estilo1.css", tb deve dar certo.

 

 

espero ter ajudado.

<{POST_SNAPBACK}>

Testei chamando estilo1.css e não deu. Não pode ser algum erro na função? 

if(document.getElementById('muda').value == "um"){
   document.getElementById('st').className = "estilo1"
       }
       else{
   document.getElementById('st').className = "estilo2"
              }
   }

Ou no Body: 

<body class="estilo" id="st">

??? http://forum.imasters.com.br/public/style_emoticons/default/cry.gif

É q não manjo muito de estilos e de javascript, hehehehehe :D

Compartilhar este post

Link para o post
Compartilhar em outros sites

VernonLacerda    0

VernonLacerda
Postado

Comigo funcionou assim:

 

<script>function altera(){    if(document.getElementById('muda').value == "um"){        document.getElementById('st').className = "menu_txt";    } else if (document.getElementById('muda').value == "dois"){        document.getElementById('st').className = "menu_txt2";    } else {        document.getElementById('st').className = ""    }}</script><style type="text/css">	<!--.menu_txt {	background-color: #F1F1F1;	COLOR: #254D6D;	border: 1px dashed #CFCFCF;	margin-top: 8px;	margin-bottom: 16px;	padding: 6px 10px 6px 10px;	line-height: 14px;	FONT: 10px Verdana, Arial, Helvetica, sans-serif;	TEXT-DECORATION: none;	TEXT-TRANSFORM: none}.menu_txt2 {	background-color: #C9C9C9;	COLOR: #254D6D;	border: 1px dashed #CFCFCF;	margin-top: 0px;	margin-bottom: 16px;	padding: 6px 10px 6px 10px;	line-height: 10px;	FONT: 10px Verdana, Arial, Helvetica, sans-serif;	TEXT-DECORATION: none;	TEXT-TRANSFORM: none}	--></style>
Uso:

 

<body class="estilo" id="st">Texto 1 <br>Texto 2 <br>Texto 3 <br><select id="muda" onChange="altera()"><option value="um">Estilo1</option><option value="dois">Estilo2</option></select><br></body>
B)

<{POST_SNAPBACK}>

http://forum.imasters.com.br/public/style_emoticons/default/clap.gif http://forum.imasters.com.br/public/style_emoticons/default/clap.gif http://forum.imasters.com.br/public/style_emoticons/default/clap.gif

VAlews!!!! Funcionou bem certinho. Tnks pela dica.

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito