Ir para conteúdo

POWERED BY:

Arquivado

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

Michel Anderson Lutz

Mudando Cor Ou Imagem De Fundo De Uma Tabela(focus) (onclick)

Por , em Javascript

Recommended Posts

Michel Anderson Lutz    0

Michel Anderson Lutz
Postado

Estou precisando de uma ajuda para mudar a cor ou imagem de fundo de uma tabela(focus) (onclick) quando a pessoa clicar tentei com css mas não deu muito certo

 

seria exatamente o mesmo efeito do site. https://login.live.com/login.srf ou

Login Live quando a pessoa clica ali aparece uma uma imagem azul de fundo e uma text area e o botão entrar espero que consigam ver esta página pois as vezes vai para outra de login do passaport.

 

 

Se algum me der uma luz de como posso fazer algo semelhante a isso fico grato.

 

se não conseguirem ver anexei uma imagem

 

Imagem Postada

ai

Compartilhar este post

Link para o post
Compartilhar em outros sites

LeonardoAP    0

LeonardoAP
Postado

eu usaria div. coloca uma classe css para a div, algo assim:

 

div.login { border=0px;				background-color: transparent; }div.login:hover { background-color: #0000DD; }
na tag do table, no html, coloca um onClick executando uma funcao

<div class="login" onClick="logar()">conteudo</div>

a funcao logar iria trocar o conteudo da div, do primeiro, para o segundo.

uma maneira de fazer isso é criar outros dois divs dentro do div principal. e alterar o display desses divs.

 

function logar(){  document.getElementById("primeiro").style.display = 'none';  document.getElementById("segundo").style.display = 'block';}

e no css, colocar para iniciar como o primeiro aparecendo, e o segundo oculto.

 

o codigo completo

 

<html><head>  <title>titulo</title></head><style>  div.login { border=0px;				  background-color: transparent; }  div.login:hover { background-color: #0000DD; }   #primeiro {display: block; }  #segundo {display: none; }</style><script language="JavaScript">  function logar()  {	document.getElementById("primeiro").style.display = 'none';	document.getElementById("segundo").style.display = 'block';  }</script><body>   <div class="login" onClick="logar()">	<div id="primeiro"> Conteudo do primeiro div</div>	<div id="segundo"> Conteudo do segundo div(o que tem o campo para digitar a senha)</div>  </div></body></html>

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