Ir para conteúdo
Fórum Script Brasil
  • 0

Script De Tooltip Popup Em Dhtml. Como Adicionar Som?

irw

Perguntado por irw,

 Share

Pergunta

irw

irw

Postado
Postado

Car@s amig@s,

Eu estou tentando escrever um script que adicione som ao script de Tooltip em DHTML apresentado em Cool DHTML Tooltip.

Eu tentei fazer um mix dos scripts Cool DHTML Tooltip e JavaScript Sound effect, mas o resultado foi, apenas, parcial.

A minha intenção é fazer o som tocar em loop enquanto o mouse estiver sobre o link. Mas isto não está acontecendo, porque o som não para quando o mouse é retirado de cima do link. Para contornar o problema, eu tive que fixar o número de vezes que o som toca.

Um outro problema é que o script está provocando a indicação de erro no carregamento da página.

Embora eu seja um iniciante, eu percebi que os scripts mencionados foram escritos com muita elegância e apresentam resultados muito bons quando rodam isoladamente, por isto eu estou tentando fazer o mix deles.

Eu preparei um protótipo de script para ser testado. Ele pode ser acessado a partir do link Tooltip Popup with Sound.

Eu ficarei muito agradecido se algum(a) do(a)s companheir@s puder me ajudar a resolver o problema..

Desejo saúde e paz a todos.

Ivo Ricardo Wanderley

Rio, RJ - Brazil

Link para o comentário
Compartilhar em outros sites

4 respostass a esta questão

Posts Recomendados

  • 0
Guest Visitante

Guest Visitante

Postado
Postado

O código que está rodando no protótipo é o seguinte:

<head>

<title>Tooltip Popup with Sound</title>

<script language="JavaScript">

</script>

<style type="text/css">

#dhtmltooltip{

position: absolute;

width: 150px;

border: 1px solid white;

padding: 20px;

background-color: lightyellow;

visibility: hidden;

z-index: 100;

font-size: 11pt; color: yellow; font-weight: 600; font-family: 'arial'; text-align: center;

/*Remove below line to remove shadow. Below line should always appear last within this CSS*/

filter: progid:DXImageTransform.Microsoft.Shadow(color=white,direction=135);

}

</style>

<bgsound src="#" id="soundeffect" loop=2 autostart="true" />

</head>

<body bgcolor="#336600" lang=PT-BR link="#FFFF33" vlink="#CCCCCC"

style='tab-interval:35.4pt'>

<div id="dhtmltooltip"></div>

<script type="text/javascript">

var soundfile=''

var offsetxpoint=-60 //Customize x offset of tooltip

var offsetypoint=20 //Customize y offset of tooltip

var ie=document.all

var ns6=document.getElementById && !document.all

var enabletip=false

if (ie||ns6)

var tipobj=document.all? document.all["dhtmltooltip"] : document.getElementById? document.getElementById("dhtmltooltip") : ""

function ietruebody(){

return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body

}

function ddrivetip(thetext, thecolor, thewidth, soundfile){

if (ns6||ie){

if (typeof thewidth!="undefined") tipobj.style.width=thewidth+"px"

if (typeof thecolor!="undefined" && thecolor!="") tipobj.style.backgroundColor=thecolor

tipobj.innerHTML=thetext

if (document.all && document.getElementById){

document.getElementById("soundeffect").src="" //reset first in case of problems

document.getElementById("soundeffect").src=soundfile

}

enabletip=true

return false

}

}

function bindsound(tag, soundfile, masterElement){

if (!window.event) return

var source=event.srcElement

while (source!=masterElement && source.tagName!="HTML"){

if (source.tagName==tag.toUpperCase()){

playsound(soundfile)

break

}

source=source.parentElement

}

}

function positiontip(e){

if (enabletip){

var curX=(ns6)?e.pageX : event.clientX+ietruebody().scrollLeft;

var curY=(ns6)?e.pageY : event.clientY+ietruebody().scrollTop;

//Find out how close the mouse is to the corner of the window

var rightedge=ie&&!window.opera? ietruebody().clientWidth-event.clientX-offsetxpoint : window.innerWidth-e.clientX-offsetxpoint-20

var bottomedge=ie&&!window.opera? ietruebody().clientHeight-event.clientY-offsetypoint : window.innerHeight-e.clientY-offsetypoint-20

var leftedge=(offsetxpoint<0)? offsetxpoint*(-1) : -1000

//if the horizontal distance isn't enough to accomodate the width of the context menu

if (rightedge<tipobj.offsetWidth)

//move the horizontal position of the menu to the left by it's width

tipobj.style.left=ie? ietruebody().scrollLeft+event.clientX-tipobj.offsetWidth+"px" : window.pageXOffset+e.clientX-tipobj.offsetWidth+"px"

else if (curX<leftedge)

tipobj.style.left="5px"

else

//position the horizontal position of the menu where the mouse is positioned

tipobj.style.left=curX+offsetxpoint+"px"

//same concept with the vertical position

if (bottomedge<tipobj.offsetHeight)

tipobj.style.top=ie? ietruebody().scrollTop+event.clientY-tipobj.offsetHeight-offsetypoint+"px" : window.pageYOffset+e.clientY-tipobj.offsetHeight-offsetypoint+"px"

else

tipobj.style.top=curY+offsetypoint+"px"

tipobj.style.visibility="visible"

}

}

function hideddrivetip(){

if (ns6||ie){

enabletip=false

tipobj.style.visibility="hidden"

tipobj.style.left="-1000px"

tipobj.style.backgroundColor=''

tipobj.style.width=''

soundfile=""

playsound(soundfile)

}

}

document.onmousemove=positiontip

</script>

<body bgcolor="#336600" lang=PT-BR link="#FFFF33" vlink="#CCCCCC"

style='tab-interval:35.4pt'>

<div>

<p class=MsoNormal ><a

href="http://www.irwanderley.eng.br/MemoriaMusical/TristezadeNosDoisTambaTrio.mp3" href="#" onMouseover="ddrivetip('Tristeza de Nós Dois played by Tamba Trio, composed by Durval Ferreira, Bebeto and Maurício Einhorn. Recorded in 1963 on the LP Avanço. Tamba Trio was formed by Luís Mainzl da Cunha Eça (piano) born in 1936 and dead in 1992; Adalberto José de Castilho e Souza, Bebeto (bass and flute), born in 1939, and Helcio Paschoal Milito, percussion, born in 1931, inventor of the Tamba percussion instrument that gave its name to the trio','blue', 400, 'http://www.irwanderley.eng.br/MemoriaMusical/TristezadeNosDoisTambaTrio.wav')";

onMouseout="hideddrivetip()">

<span style='mso-bidi-font-size:8.0pt;color:yellow;font-weight:normal'>Tristeza de Nós Dois played by Tamba Trio</span>

</a>

</p>

</div

</body>

</html>

Link para o comentário
Compartilhar em outros sites
  • 0
fercosmig

fercosmig

Postado
Postado
function hideddrivetip(){

if (ns6||ie){

enabletip=false

tipobj.style.visibility="hidden"

tipobj.style.left="-1000px"

tipobj.style.backgroundColor=''

tipobj.style.width=''

soundfile='a';

playsound(soundfile)

}

}

document.onmousemove=positiontip

</script>

<body bgcolor="#336600" lang=PT-BR link="#FFFF33" vlink="#CCCCCC"

style='tab-interval:35.4pt'>

<div>

<p class=MsoNormal ><a

href="http://www.irwanderley.eng.br/MemoriaMusical/TristezadeNosDoisTambaTrio.mp3" href="#" onMouseover="ddrivetip('Tristeza de Nós Dois played by Tamba Trio, composed by Durval Ferreira, Bebeto and Maurício Einhorn. Recorded in 1963 on the LP Avanço. Tamba Trio was formed by Luís Mainzl da Cunha Eça (piano) born in 1936 and dead in 1992; Adalberto José de Castilho e Souza, Bebeto (bass and flute), born in 1939, and Helcio Paschoal Milito, percussion, born in 1931, inventor of the Tamba percussion instrument that gave its name to the trio','blue', 400, 'http://www.irwanderley.eng.br/MemoriaMusical/TristezadeNosDoisTambaTrio.wav')";

onMouseout="hideddrivetip()">

você está colocando a função para rolar um som no evento onmouseout... aí vai rolar o som sempre que o mouse sair de cima do link!!!

function hideddrivetip(){

if (ns6||ie){

enabletip=false

tipobj.style.visibility="hidden"

tipobj.style.left="-1000px"

tipobj.style.backgroundColor=''

tipobj.style.width=''

soundfile=""

playsound(soundfile)

}

}

abraços

Link para o comentário
Compartilhar em outros sites
  • 0
irw

irw

Postado
  • Autor
Postado

A função que toca o som está dentro do evento onmouseout, mas antes de rodá-la foi atribuído o valor blank à variável que contém o nome do arquivo de som. Foi a maneira que imaginei para interromper a função que estaria rodando com o som anteriormente atribuído a partir do evento onmouseover.

Na sua transcrição do código da função hideddrivetip você atribuiu o valor ['a';] à variável soundfile. Esta seria a maneira de emudecer a função playsound no evento onmouseout?

Abraços,

Ivo

Link para o comentário
Compartilhar em outros sites

Participe da discussão

Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.

Visitante
Responder esta pergunta...

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emoticons são permitidos.

×   Seu link foi incorporado automaticamente.   Exibir como um link em vez disso

×   Seu conteúdo anterior foi restaurado.   Limpar Editor

×   Você não pode colar imagens diretamente. Carregar ou inserir imagens do URL.

×
 Share
Ir para lista de Perguntas


  • Estatísticas dos Fóruns

    • Tópicos
      152,3k
    • Posts
      652,4k
×
×
  • Criar Novo...