[Resolvido] Mudar de imagem ao passar o mouse em cima

Cara isso você não vai fazer em php..

Dá uma olhada nos eventos onmouseover e onmouseout do javascript e no pseudo-elemento :hover do css

Como as imagens não voltam ao normal (ou seja, depois passa a aparecer todas as imagens) aconselho a fazer uma class, setar o display pra none no css, e quando passar o mouse em cima, muda o .style.display pra block ou inline

Como o amigo disse, com PHP não tem jeito. No seu caso, só com Javascript (talvez). Vou mover para o fórum correto.

Tópico Movido

PHP http://forum.imasters.com.br/public/style_emoticons/default/seta.gif Javascript

>

Cara isso você não vai fazer em php..

Dá uma olhada nos eventos onmouseover e onmouseout do javascript e no pseudo-elemento :hover do css

Como as imagens não voltam ao normal (ou seja, depois passa a aparecer todas as imagens) aconselho a fazer uma class, setar o display pra none no css, e quando passar o mouse em cima, muda o .style.display pra block ou inline

Pois é amigão, eu entrei aqui pra ver se alguém já tinha algo pronto, eu não saco nada de java e nem css, mais valeu mesmo assim por me ajudar.

Vou procurar novamente na internet =)

Thx

Primeiro você deve pegar o elemento imagem para depois mudar o seu src.

Procure aqui no fórum que você vai achar um exemplo que eu mesmo coloquei aqui a algum tempo.

Ok? qualquer coisa pergunte denovo.

>
Primeiro você deve pegar o elemento imagem para depois mudar o seu src.

Procure aqui no fórum que você vai achar um exemplo que eu mesmo coloquei aqui a algum tempo.

Ok? qualquer coisa pergunte denovo.

Tentei procurar em seus posts, mais é muita página pra ver..

Poderia postar pra mim aqui?

Desculpa o incomodo =)

function icone(img){
 //debugger;

 veiculos = img.value; //valor do ícone que tinha antes
 imagem = document.getElementById("carrinho"); //meu elemento imagem
 imagem.src = "images/carro2.png";
}

<img id="carrinho" src="images/carro1.png" onmouseover="icone(this)" />

Seria mais ou menos isso cara, não tenho certeza se isso vai funcionar pq fiz de cabeça agora mas seria essa a idéia.

>

function icone(img){
 //debugger;

 veiculos = img.value; //valor do ícone que tinha antes
 imagem = document.getElementById("carrinho"); //meu elemento imagem
 imagem.src = "images/carro2.png";
}

<img id="carrinho" src="images/carro1.png" onmouseover="icone(this)" />

Seria mais ou menos isso cara, não tenho certeza se isso vai funcionar pq fiz de cabeça agora mas seria essa a idéia.

Não ta funcionando nada aqui :S

Mais pelo que vi só funciona a imagem principal e uma imagem extra, esse código eu já tenho, mais o que eu queria conseguir era de passar várias imagens (5 extras fora a principal).

Obrigado mesmo assim!

você quer é um slideshow ?

dê uma olhada nesses:

http://forum.imasters.com.br/index.php?/topic/384533-slideshow-com-pequeno-bug/

http://forum.imasters.com.br/index.php?/topic/270079-indice-dos-scripts/

>
você quer é um slideshow ?

dê uma olhada nesses:

http://forum.imaster...om-pequeno-bug/

http://forum.imaster...ce-dos-scripts/

Cara, seria mais ou menos igual ao seu slide show, porém o que eu queria era passar o mouse em cima de uma imagem, e começar a mudar, e depois que tirar o mouse de cima, ela parasse e voltasse pra imagem principal, eu não faço a minima ideia de como fazer isso nesse slide show, mais era isso mesmo que estava querendo mesmo!

Se conseguir fazer isso, ficarei grato!

Abraço!

UP, sem resolução ainda :S

Que tal criar um gif animado e deixá-lo como a segunda imagem?

Se não servir essa opção, você deverá apenas criar um setTimeout para ir chamando outra função e chamando as outras imagens (durante o mouseover).

No mouseout, você chama outra função, que irá parar o setTimeout e deixar apenas a imagem pré-definida.

Mostre-nos o que você já fez... ou já tentou fazer, porque postar código pronto é meio canseira, entende? O trampo aqui está apertado...

>
Que tal criar um gif animado e deixá-lo como a segunda imagem?

Se não servir essa opção, você deverá apenas criar um setTimeout para ir chamando outra função e chamando as outras imagens (durante o mouseover).

No mouseout, você chama outra função, que irá parar o setTimeout e deixar apenas a imagem pré-definida.

Mostre-nos o que você já fez... ou já tentou fazer, porque postar código pronto é meio canseira, entende? O trampo aqui está apertado...

Eu achei isso ai na net, eh exatamente o que estava procurando, porque dai posso criar o evento onmouseover e onmouseout, a duvida vem agora, são diversas imagens contendo essa função de imagens rotativas ao passar o mouse, ai tava vendo como iria fazer porque todas as imagens sairiam do BD (todos os caminhos das imagens tao numa tabela).

Esse é o problema, porque nao é apenas uma imagem que vai ter essa função são muitas, ai não sei como fazer, tem alguma ideia, eu não saco de JavaScript, mais se poder ajudar-me, grato irei ficar!

<html>

<script>

 var proximaNoticia = 0;
 //o array onde ficam as notícias
 var arrNoticias = new Array();
 arrNoticias[0] = "Primeira notícia";
 arrNoticias[1] = "Segunda notícia, maior";
 arrNoticias[2] = "Esta é a terceira";
 arrNoticias[3] = "E por último, mas não menos importante...";

function mudaNoticia()

 document.getElementById('divNoticias').innerHTML = arrNoticias[proximaNoticia];

 //um if para saber qual a próxima notícia
 if (proximaNoticia == arrNoticias.length-1)
 {
 proximaNoticia = 0;
 }
 else
 {
 proximaNoticia++;
 }
}

//faz executar a função mudaNoticia a cada 3 segundo (3000 milesimos de segundo)

window.setInterval(mudaNoticia, 3000);

</script>
<body onload="mudaNoticia()">

 <div id="divNoticias"></div>

</body></html>

UP, sem resolução ainda :S

Não consegui editar o titulo do tópico, mais felizmente consegui a resolução :) :)