Fóruns sobre PHP, JavaScript, HTML, MySQLi, jQuery, Banco de Dados, CSS

Moderador: web

 
Primeiras postagens
Primeiras postagens
Tópico Autor
Mensagens: 2
Sexo: Masculino
Localização: Pr
Contato:

Rollover Imagem para Texto

22-01-2008 11:46

Olá galera,
Preciso de ajuda para fazer um rollover de imagem para texto, quando o mouse estiver em cima da imagem ela altera para um texto.

Valew

Will
0
Will
 
Avatar do usuário
ADMIN
ADMIN
Mensagens: 17248
Nome: Kleber
Descrição do site: Onde você encontra scripts grátis para o seu site
Sexo: Masculino
Localização: RJ / RJ / Brasil
Contato:

Rollover Imagem para Texto

22-01-2008 12:04

Veja o exemplo

Note que o script trabalha por blocos, ou seja, cada bloco você vai mudar o número, conteudo1, conteudo2, conteudo3, etc... para todos que tem números

É aconselhável colocar cada bloco em td, para melhor organização.

CSS
<style type="text/css"> .div, .span{ width:150px; height:150px; } .conteudo{ width:150px; height:150px; background-color:#cccccc; } </style>

JAVASCRIPT
<script type="text/javascript"> function OnMouse(local,conteudo) { document.getElementById(local).innerHTML=document.getElementById(conteudo).innerHTML; } function OnOut(local,conteudo) { document.getElementById(local).innerHTML=document.getElementById(conteudo).innerHTML; } </script>

HTML

<!-- bloco 1 //-->
<div class="span" onmouseover="this.className='conteudo'; OnMouse('local1','conteudo1')" onmouseout="this.className='div'; OnOut('local1','imagem1')"><div id="local1"><img src="figura.jpg" width="150" height="150"></div></div>

<div id="imagem1" style="display:none;"><img src="figura.jpg" width="150" height="150"></div>
<div class="conteudo" id="conteudo1" style="display:none;">conteúdo do img1</div>
<!-- bloco 1 //-->
0
Criar site grátis Wix
Hospedagem de sites Hostgator
Tem um script legal em HTML, CSS, PHP, HTML, JavaScript, jQuery? Poste e compartilhe com os usuários do fórum
:rock:
 
Primeiras postagens
Primeiras postagens
Tópico Autor
Mensagens: 2
Sexo: Masculino
Localização: Pr
Contato:

Rollover Imagem para Texto

22-01-2008 12:59

Valew...
Deu Certo...
Ok!
0
Will
 
Avatar do usuário
ADMIN
ADMIN
Mensagens: 17248
Nome: Kleber
Descrição do site: Onde você encontra scripts grátis para o seu site
Sexo: Masculino
Localização: RJ / RJ / Brasil
Contato:

Rollover Imagem para Texto

22-01-2008 13:01

¨smiley¨
0
Criar site grátis Wix
Hospedagem de sites Hostgator
Tem um script legal em HTML, CSS, PHP, HTML, JavaScript, jQuery? Poste e compartilhe com os usuários do fórum
:rock:

Quem está online

Usuários navegando neste fórum: Nenhum usuário registrado