8 replies to this topic

[N007]

é o seguinte queria me lembrar do comando que faz por exemplo:
Imagem1.gif
Com o mouse encima troca para:
Imagem2.gif

como posso fazer isso? e se funciona com input?

[Kadu DG]

acho que o que vc quer seria isso:

<input type="image" name="button" id="button" src="imagem1" onMouseOver="this.src='imagem2'" onMouseOut="this.src='imagem1'" value="Submit"/>

[Stress]

também quero isso, mas não funcionou. hehehe

poderia por gentileza me explicar onde coloco o caminho da imagem e qual não posso mecher, tentei ambos aí deu tilt.

quero quando passe o mouse em cima de uma imagem apareça outra, vamos supor que a imagem seja o "sol" e quando vier passar o mouse sobre o "sol" venha aparecer a "lua" no mesmo espaço e local.

ficarei grato.

[Alex Hiroshi]

Você quer mostrar em uma imagem normal ou em um botão? Vou explicar o que o Kadu mostrou.

<input type="image" name="button" id="button" src="imagem1" onMouseOver="this.src='imagem2'" onMouseOut="this.src='imagem1'" value="Submit"/>

Imagem principal. O botão vai começar com essa imagem. (sol)
Quando colocar o mouse no botão, vai entrar essa. (lua)
Quando tirar o mouse, vai entrar essa. (sol?)

[Stress]

Você quer mostrar em uma imagem normal ou em um botão? Vou explicar o que o Kadu mostrou.

<input type="image" name="button" id="button" src="imagem1" onMouseOver="this.src='imagem2'" onMouseOut="this.src='imagem1'" value="Submit"/>

Imagem principal. O botão vai começar com essa imagem. (sol)
Quando colocar o mouse no botão, vai entrar essa. (lua)
Quando tirar o mouse, vai entrar essa. (sol?)

opa, beleza agora conseguir obrigado!

essa linha de comando é pesado?
notei um pouco isso.

tem como obter isso...? quando passar o mouse numa imagem a esquerda e aparecer outra imagem na direita? (enfim, locais diferentes.)

[Alex Hiroshi]

Pesado em qual sentido? Ele pode demorar um pouco para fazer a troca de imagens, já que a que está 'escondida' só será carregada após o mouseover. Dá para carregar a imagem antes, ocultamente.

var imgCarrega = new Image();
imgCarrega.src="url_imagem";

Também dá para fazer com css, usando uma imagem.

Tem sim. É só buscar a imagem que você quer mudar e colocar no onmouseover/out:

onmouseover="doument.getElementById('imagem_direita').src='nova_imagem'"

E é assim para o mouseout, basta trocar o 'nova_imagem' pela imagem certa. Veja que aí não foi usado o this.src e sim o document.getElementById('imagem_direita') - imagem_direita é o id da imagem.

[Kadu DG]

Hiroshi, como eu faria para que ele carregasse ocultamente todas as imagens que tenham o efeito?

[Alex Hiroshi]

É só ir criando novas imagens.

imagem1 = new Image(); imagem1.src="um.gif";
imagem2 = new Image(); imagem2.src="dois.gif";

Ou coloca as imagens tudo em um array e vai atribuindo os src para cada imagem.