Link's com camadas

[Magnoweb 0]

Galera tô precisando de uma ajudinha...

 

É o seguinte, tô querendo fazer uma lista de produtos (Dinâmico-ASP) onde me dá opção de ver a foto de cada produto ao passar o mouse em cima.

Ex.: Kuruma (Monte o seu)

 

Pensei utilizar camadas, alguém pode me ajudar???

 

As imagens vão estar salvas no BD.

[Reginaldo 0]

AMIGO, NÃO SERIA MAIS PRATICO E EFICIENTE MONTAR ESSE SISTEMA EM FLASH ?POSSO AJUDAR SE QUISER FELIZ ANO NOVO.

[FabricioGomes 0]

ou entao, entra no site e pega o codigo...procura por onmouseover e onmouseout que voce encontra o codigo... é fácil, utiliza uma funcao swapimage, acho...abraços.

[Reginaldo 0]

MAS COM AS CAMADAS BASTA você SELECIONAR O LINK, COMPORTAMENTOS, ADICIONAR, MOSTROR OCULTAR CAMADAS, MOSTRAR (ONMOUSEOVER)REPITA ESSE PROCEDIMENTO MAS DESSA VEZ VOLOQUE OCULTAR (ONMOUSEOUT)PRECISANDO DE AJUDA EU TO NO MSN..VALEW.

[Alex Hiroshi 7]

. . fiz um aqui rapidinho... trabalhe em cima disso que você consegue adaptar com os dados que você pega do banco de dados.. ^_^

qualquer coisa, poste

 

ASP [/tr][tr]<script>

function muda(x){

if(x==""){

document.getElementById("imagem").style.display = "none";

}

else {

document.getElementById("imagem").style.display = "block";

document.getElementById("imagem").src=x;

}

}

</script>

 

<a hef="#" onmouseover="muda('URL DE UMA IMAGEM.gif');" onmouseout="muda('');"> Link </a> <br />

<a hef="#" onmouseover="muda('URL DA OUTRA IMAGEM.gif');" onmouseout="muda('');"> Link </a> <br />

<img src="" style="display: none" id="imagem" />

[/tr]

[giga_fire 0]

. . fiz um aqui rapidinho... trabalhe em cima disso que você consegue adaptar com os dados que você pega do banco de dados.. ^_^

qualquer coisa, poste

Só vou adicionar mais uma coisinha que ficou faltando, mas o código é esse mesmo...

 

ASP [/tr][tr]<script type="text/javascript">

function muda(x){

if(x==""){

document.getElementById("imagem").style.display = "none";

document.getElementById("imagem").style.visible = "hidden";

}

else {

document.getElementById("imagem").style.display = "block";

document.getElementById("imagem").style.visible = "visible";

document.getElementById("imagem").src=x;

}

}

</script>

 

<a hef="#" onmouseover="muda('URL DE UMA IMAGEM.gif');" onmouseout="muda('');"> Link </a> <br />

<a hef="#" onmouseover="muda('URL DA OUTRA IMAGEM.gif');" onmouseout="muda('');"> Link </a> <br />

<img src="algumafigurainicial.jpg" style="display: none;visible: hidden" id="imagem" />

[/tr]

 

Espero ter ajudado

Falow

[Alex Hiroshi 7]

assim você deixa o script louco :rolleyes:

 

você coloca o mouse e faz aparecer e desaparecer a mesma imagem? ele não vai entender..

e essa linha tbm ta errada

document.getElementById("imagem").style.visible = "hidden";

no caso, é visibility no lugar de visible.. e usando o visibility.. a imagem some, mais deixa o seu espaço de uso na tela... com o display, ele tira o espaço..

essa tbm não esta certa

document.getElementById("imagem").style.visible = "visible";

essa tbm ficou estranha

<img src="algumafigurainicial.jpg" style="display: none;visible: hidden" i

não é necessario dar um valor, uma url pra imagem principal, pq essa imagem vai ficar oculta.. entao nao vai ter imagem principal...

e tbm não precisa aplicar dois codigos para deixar a imagem oculta... (display: none e visible: hidden .. que seria visibility tbm)

a tag <img> é usada apenas para fazer as imagens aparecerem ao passar do mouse sore um link

:)