3 replies to this topic

[noodlebox2d]

Pessoal.. tenho um código aqui pra fazer links com layers explicativos que aparecem e desaparecem de acordo com a posição do mouse .. mas o que acontece é que quando tento colocar mais de dois links utilizando a função em javascript, ocorre um erro.. aí vão os códigos:

Script

&lt;script language="JavaScript" type="text/JavaScript">//detectando navegadorsAgent = navigator.userAgent;bIsIE = sAgent.indexOf("MSIE") > -1;bIsNav = sAgent.indexOf("Mozilla") > -1 && !bIsIE;//setando as variaveis de controle de eventos do mousevar xmouse = 0;var ymouse = 0;document.onmousemove = MouseMove;//funcoes de controle de eventos do mouse:function MouseMove(e){ if (e) { MousePos(e); } else { MousePos();}}function MousePos(e) { if (bIsNav){  xmouse = e.pageX;  ymouse = e.pageY; }  if (bIsIE) {  xmouse = document.body.scrollLeft + event.x;  ymouse = document.body.scrollTop + event.y; }}//funcao que mostra e esconde o hintfunction Hint(objNome, action){ //action = 1 -> Esconder //action = 2 -> Mover  if (bIsIE) {  objHint = document.all[objNome];  } if (bIsNav) {  objHint = document.getElementById(objNome);  event = objHint; }  switch (action){  case 1: //Esconder   objHint.style.visibility = "hidden";   break;  case 2: //Mover   objHint.style.visibility = "visible";   objHint.style.left = xmouse + 15;   objHint.style.top = ymouse + 15;   break; } }</script>

código do link:

<td bgcolor="#FFFFFF" width="636" bordercolor="#C0C0C0" bordercolorlight="#C0C0C0" bordercolordark="#C0C0C0" style="border: 1px solid #CECECE">			<a href="#" onMouseMove="Hint('link',2)" onMouseOut="Hint('link',1)">Nome do Link</a>			<td width="25" bgcolor="#FFFFFF"> </td>			<div id="link" style="position:absolute; z-index:1; visibility: hidden; background-color: #e4e4e4; layer-background-color: #FFFFCC; border: 1px none #000000;"><font size="1" face="Verdana" color="#000000">Descrição do Link</font></div>

O estranho é que quando é um link só.. o código fuciona... mas quando tento colocar mais de um, acontece um erro:

http://img402.images...923/errojm7.jpg

Se alguém puder ajudar... eu agradeceria muito ^^

Edição feita por: noodlebox2d, 21/07/2007, 00:56.

[matt.cavotta]

Eu consegui fazer rodar aqui no FF e no IE6.0 com três links diferentes. Esse código que você passou é para 1. Como você o modificou para mais links?

Pessoal.. tenho um código aqui pra fazer links com layers explicativos que aparecem e desaparecem de acordo com a posição do mouse .. mas o que acontece é que quando tento colocar mais de dois links utilizando a função em javascript, ocorre um erro.. aí vão os códigos:

Script

&lt;script language="JavaScript" type="text/JavaScript">//detectando navegadorsAgent = navigator.userAgent;bIsIE = sAgent.indexOf("MSIE") > -1;bIsNav = sAgent.indexOf("Mozilla") > -1 && !bIsIE;//setando as variaveis de controle de eventos do mousevar xmouse = 0;var ymouse = 0;document.onmousemove = MouseMove;//funcoes de controle de eventos do mouse:function MouseMove(e){ if <img src='http://forum.wmonline.com.br/public/style_emoticons/<#EMO_DIR#>/envelope.gif' class='bbc_emoticon' alt='(e)' /> { MousePos(e); } else { MousePos();}}function MousePos(e) { if (bIsNav){  xmouse = e.pageX;  ymouse = e.pageY; }  if (bIsIE) {  xmouse = document.body.scrollLeft + event.x;  ymouse = document.body.scrollTop + event.y; }}//funcao que mostra e esconde o hintfunction Hint(objNome, action){ //action = 1 -> Esconder //action = 2 -> Mover  if (bIsIE) {  objHint = document.all[objNome];  } if (bIsNav) {  objHint = document.getElementById(objNome);  event = objHint; }  switch (action){  case 1: //Esconder   objHint.style.visibility = "hidden";   break;  case 2: //Mover   objHint.style.visibility = "visible";   objHint.style.left = xmouse + 15;   objHint.style.top = ymouse + 15;   break; } }</script>

código do link:

<td bgcolor="#FFFFFF" width="636" bordercolor="#C0C0C0" bordercolorlight="#C0C0C0" bordercolordark="#C0C0C0" style="border: 1px solid #CECECE">			<a href="#" onMouseMove="Hint('link',2)" onMouseOut="Hint('link',1)">Nome do Link</a>			<td width="25" bgcolor="#FFFFFF"> </td>			<div id="link" style="position:absolute; z-index:1; visibility: hidden; background-color: #e4e4e4; layer-background-color: #FFFFCC; border: 1px none #000000;"><font size="1" face="Verdana" color="#000000">Descrição do Link</font></div>

O estranho é que quando é um link só.. o código fuciona... mas quando tento colocar mais de um, acontece um erro:

http://img402.images...923/errojm7.jpg

Se alguém puder ajudar... eu agradeceria muito ^^

A propósito, como eu fiz:

<a href="#" onMouseMove="Hint('link',2)" onMouseOut="Hint('link',1)">Nome do Link</a>
<div id="link" style="position:absolute; z-index:1; visibility: hidden; background-color: #e4e4e4; layer-background-color: #FFFFCC; border: 1px none #000000;">
<font size="1" face="Verdana" color="#000000">Descrição do Link</font>
</div>

<a href="#" onMouseMove="Hint('link2',2)" onMouseOut="Hint('link2',1)">Nome do Link2</a>
<div id="link2" style="position:absolute; z-index:1; visibility: hidden; background-color: #e4e4e4; layer-background-color: #FFFFCC; border: 1px none #000000;">
<font size="1" face="Verdana" color="#000000">Descrição do Link2</font>
</div>

<a href="#" onMouseMove="Hint('link3',2)" onMouseOut="Hint('link3',1)">Nome do Link3</a>
<div id="link3" style="position:absolute; z-index:1; visibility: hidden; background-color: #e4e4e4; layer-background-color: #FFFFCC; border: 1px none #000000;">
<font size="1" face="Verdana" color="#000000">Descrição do Link3</font>
</div>

Edição feita por: matt.cavotta, 21/07/2007, 01:18.

[noodlebox2d]

Eu sou lesado demais XD
eu estava copiando o código sem mudar a id do layer e do link ... mas vlew aee por ter ajudado...
bom.. fica o código aqui pra quem quiser usar... é bem bonitinho ^^

[matt.cavotta]

(...) fica o código aqui pra quem quiser usar... é bem bonitinho ^^

Gostei da idéia. Posso colocar na seção de Banco de Funções?