Mudar Cor Do Menu

[pe.leal]

Pessoal estou fazendo um menu com varios itens de opções, ex

CIDADE CEP ENDERECO BAIRRO

A cor do menu é azul, mas quando clico em cidade por exemplo somente o TD de cidade fica cinza, depois se clicar em BAIRRO ele fica cinza e CIDADE volta a ficar azul e assim por diante, gostaria de saber como faço para que mesmo que eu de um reload na pagina o ultimo menu clicado permaneça com a cor cinza, tem como fazer isso ?

Segue um trexo do codigo que estou usando:

<td align='center' CLASS="menu" width='152' onBlur="volta(this)" onClick="menucid(this)" style="cursor: hand;">

function menucid(what)

{

what.style.background='silver';

}

function volta(what)

{

what.style.background='99ccff';

}

E uso assim para todos os itens do menu.

Se alguém souber e puder me ajudar

Tks

[Fabi SP]

Eu estava pensando aqui em uma solução...

Pra você saber qual opção está selecionada, mesmo depois de dar um reload, tem 2 opções:

- Mandar a opção via Querystring e captar no JS, jogando em alguma função que trate as cores dos menus;

- Em vez de usar Querystring, passe como valor em um campo hidden de formulário e recupere no JS;

Tendo o valor selecionado, basta mudá-lo para a cor desejada e mudar todas as outras opções pra outra cor.

Se eu achar uma solução melhor, posto aqui, OK?

[Manwë Súlimo]

Cara, você só usa HTML?? porque se você usasse ASP seria bem facil.... mas vamos tentar com HTML e JS....

primeira hipotese: se você tem o menu em cada página (e não um arquivo de menu) simplesmente mude o codigo na pagina determina para a determinada cor que vocêr quer usar....

segunda hipótese: se você tem um arquivo de menu, ou mesmo um menu em cada página, mas não quer mudar o codigo p/ cada página, você pode tentar fazer o seguinte: (não sei se vai dar certo)

if (query=texto_do_menu)

muda a cor

else

fica a cor normal

onde query seria uma querystring que você passaria pela url, e texto_do_menu seria o texto do menu que você usaria para saber se o link é o da página ativa....

por exemplo

pagina1.htm?query=pagina1

query=pagina1

para pegar a query é alguma coisa do tipo lastIndexOf(documento.location,"=")

não sei se é exatamente assim que usa.... c conseguiu enteder a lógica????

ai você adapta p/ a sua necessidade, ams mesmo assim, não sei se vai dar certo.....

até mais

[pe.leal]

Obigaduuu

Pelas dicas vou testar aqui e qualquer coisa retorno.

PS: estou usando uma pagina só e estou fazendo-a em ASP, HTML e JavaScript.

Tks

[pe.leal]

Mas vocês acham que devo tirar esse onBlur ()

Não esta querendo funcionar.

Tks

[Illidan]

Pelo o que você tá querendo, o evento onblur aí não teria necessidade... =)

"onblur" é quando você tira o foco de algum campo do formulário.

[pe.leal]

Tentei tirar o onBlur, mas ai não da certo pois quando clico em outro item do menu o anterior continua cinza e todos ficam cinza e não voltam mais para a cor azul .

Tks

[leo71]

Faz assim:

no JS:

cor_over = "#00ffff"

cor_out = "#bbbbbb"

function cor(parte)

{

inps=document.getElementsByTagName("td")

inps.style.backgrund = cor_out

if(parte.style.background == cor_over)

{

parte.style.background = cor_out

}

else

{

parte.style.background = cor_over

}

}

No HTML:

Bom, não sei muito de TABLE, mais vou tentar

<TABLE>

<TR>

<TD ONCLICK="cor(this)">Muda</TD>

</TR>

<TR>

<TD ONCLICK="cor(this)">Troca</TD>

</TR>

</TABLE>

Testa ae!!!!

[pe.leal]

Leo,

O que seria esse "TD" ?

inps=document.getElementsByTagName("td")

No Td coloquei o seguinte codigo, então ficou assim:

<td align='center' CLASS="menu" width='152' onClick="menucid(this)" style="cursor: hand;"><input type="hidden" name="cid" value='1'>

O TD seria o nome de dei para o hidden ? No caso "cid" ?

Tks

[Illidan]

Leo,

O que seria esse "TD" ?

inps=document.getElementsByTagName("td")

No Td coloquei o seguinte codigo, então ficou assim:

<td align='center' CLASS="menu" width='152' onClick="menucid(this)" style="cursor: hand;"><input type="hidden" name="cid" value='1'>

O TD seria o nome de dei para o hidden ? No caso "cid" ?

Tks

Oi...

Quando você faz, por exemplo:

document.getElementsByTagName("td").style.color = 'red';

você estará mudando para a cor vermelha todos os textos que estiverem entre <td> e </td>... entendeu?

[pe.leal]

Agora entendi .

tks

[Manwë Súlimo]

no td você usa onmouseout no lugar no onblur e onmouseover no lugar do onfocus......

até

[DataSet]

<html>

<script language=javascript>

var cor_over = "#00ffff";

var cor_out = "#bbbbbb";

var objAnt = new Object();

function cor(parte)

{

  parte.style.background = cor_out;

  if (objAnt[0])

    objAnt[0].style.background = cor_over;

  objAnt[0] = parte;

}

</script>

<body>

<TABLE>

<TR><TD ONCLICK="cor(this)" style="cursor: hand; background:#00ffff">menu 1</TD></TR>

<TR><TD ONCLICK="cor(this)" style="cursor: hand; background:#00ffff">menu 2</TD></TR>

<TR><TD ONCLICK="cor(this)" style="cursor: hand; background:#00ffff">menu 3</TD></TR>

<TR><TD ONCLICK="cor(this)" style="cursor: hand; background:#00ffff">menu 4</TD></TR>

<TR><TD ONCLICK="cor(this)" style="cursor: hand; background:#00ffff">menu 5</TD></TR>

</TABLE>

</body>

</html>

Testa aí... aqui comigo fuincionou...

Até +