← Desenvolvimento

como passar o rato numa imagem e aparecer ao lado outra

Lida 4189 vezes

Offline

frsantos 
Membro
Mensagens 1458 Gostos 0
Troféus totais: 35
Trófeus: (Ver todos)
Linux User Mobile User Apple User Level 6 Super Combination Combination Topic Starter 10 Poll Votes Poll Voter Poll Starter

boas eu queria que ao passar com o rato numa imagem surgisse 1 outra ao lado.
como faço isso?
Offline

icaro 
Membro
Mensagens 128 Gostos 0
Troféus totais: 26
Trófeus: (Ver todos)
Super Combination Combination Topic Starter Poll Voter Level 5 Level 4 Level 3 Level 2 Level 1 100 Posts

por exemplo assim:

Código: [Seleccione]
<img src="A.gif" border="0" name="imagem1" onMouseOver="document.imagem2.src='B.gif'">

<img src="C.gif" border= "0" name="imagem2">  


ou seja ao ser atribuido o nome à imagem ele pode ser acedido pelos manejadores de eventos (e não só).

A imagem em C poderá ser totalmente transparente para a B aparcer do nada
Offline

frsantos 
Membro
Mensagens 1458 Gostos 0
Troféus totais: 35
Trófeus: (Ver todos)
Linux User Mobile User Apple User Level 6 Super Combination Combination Topic Starter 10 Poll Votes Poll Voter Poll Starter

m eu queria que ao tirar o rato da imagem A a imagem B volta-se a aparecer, ou seja a imagem C so aparece enquanto o rato esta em cima da imagem A
Offline

icaro 
Membro
Mensagens 128 Gostos 0
Troféus totais: 26
Trófeus: (Ver todos)
Super Combination Combination Topic Starter Poll Voter Level 5 Level 4 Level 3 Level 2 Level 1 100 Posts

Citação de: "x_santos"
m eu queria que ao tirar o rato da imagem A a imagem B volta-se a aparecer, ou seja a imagem C so aparece enquanto o rato esta em cima da imagem A


a ver se entendi: existe uma imagem A sempre visivel e duas imagens B e C que alteram consoante o rato está em cima da imagem A ou não.

Código: [Seleccione]
<img src="A.gif" border="0" name="imagem1" onMouseOver="document.imagem2.src='C.gif'"  onMouseOut="document.imagem2.src='B.gif' ">

<img src="B.gif" border= "0" name="imagem2">
Offline

fpware 
Fundador
Mensagens 15318 Gostos 7
Troféus totais: 38
Trófeus: (Ver todos)
Linux User Mobile User Level 6 Super Combination Combination Topic Starter 10 Poll Votes Poll Voter Poll Starter Level 5

É deve ser isso icaro! ;)
Offline

Ricardo75 
Membro
Mensagens 1660 Gostos 0
Troféus totais: 28
Trófeus: (Ver todos)
Super Combination Combination Topic Starter 10 Poll Votes Poll Voter Level 5 Level 4 Level 3 Level 2 Level 1

Boas, tentei usar esse código e não me funciona na totalidade.
Não o quero para a mesma finalidade que o x_santos, mas é quase a mesma coisa (acho eu).
O que eu quero é apenas o rollover numa imagem. Tudo funciona bem no estado normal, no estado hover, mas falha no estado out.
o código que estou a utilizar é este:
Código: [Seleccione]
<img src="imagens/botao_rock0.gif" alt="Rock" name="br" border="0" onMouseOver="document.br.src='imagens/botao_rock1.gif'" onMouseOut="document.br.src=imagens/botao_rock0.gif">

Sabem-me dizer o que estou a fazer de errado?

Eu já tive isso a funcionar, mas com o código que o dreamweaver põe que é muito mais código que este, o outro são várias linhas ao todo, este é muito ais simples de usar e de entender.
Offline

Ricardo75 
Membro
Mensagens 1660 Gostos 0
Troféus totais: 28
Trófeus: (Ver todos)
Super Combination Combination Topic Starter 10 Poll Votes Poll Voter Level 5 Level 4 Level 3 Level 2 Level 1

:oops:  :oops:  :oops:

faltavam os 2 '
tá resolvido.

Obrigado pelo código, serve na perfeição para o que quero e como já disse é bem mais pequeno que o do dreamweaver!
Offline

fpware 
Fundador
Mensagens 15318 Gostos 7
Troféus totais: 38
Trófeus: (Ver todos)
Linux User Mobile User Level 6 Super Combination Combination Topic Starter 10 Poll Votes Poll Voter Poll Starter Level 5

Esses erros são tão irritantes... Ainda há pouco tempo passei horas a olhar para um código e o que faltava era uma droga de umas aspas...
Offline

Ricardo75 
Membro
Mensagens 1660 Gostos 0
Troféus totais: 28
Trófeus: (Ver todos)
Super Combination Combination Topic Starter 10 Poll Votes Poll Voter Level 5 Level 4 Level 3 Level 2 Level 1

E olha que não foi hoje que tentei fazer isto, tentei pela 1ª vez no início da semana e não consegui, voltei a pegar hoje e não consegui, até que não encontrava uma explicação lógica para não funcionar vim aqui...
Até que me decidi ver qual era o erro do javascript que dava e dizia que a fuinção imagem não estava definida  :? fui olhar mais de perto para essa parte da imagem e reparei que faltavam as aspas  :oops:

Isto realmente :D Mas já está a funcionar, isso é que interessa, mas mesmo assim o IE continua a bloquear isso se correr o html a partir do meu pc, não sei porquê, pensei que era do script do dreamweaver, mas afinal não é.   :?
Offline

fpware 
Fundador
Mensagens 15318 Gostos 7
Troféus totais: 38
Trófeus: (Ver todos)
Linux User Mobile User Level 6 Super Combination Combination Topic Starter 10 Poll Votes Poll Voter Poll Starter Level 5

O IE é louco... Não lhe ligues :D