Programación Web y Scripting > JavaScript
Problema Con Onmouseover, Onmouseout Y Onmousedown
zaida20:
Hola tengo la suiguente duda:
Tengo una imagen y quiero que cuando se haga onMouseOut cambie la imagen, al hacer onMouseover vuelva a la imagen del inicio y al hacer onMouseDown permanezca la segunda imagen aunque quites el cursor de la imagen. Éste es el código que tengo, pero no me lo hace correctamente, cada vez que quito el cursor de encima vuelve a la imagen del principio:
--- Código: Text --- <img onMouseOver="imagen_a()" onMouseOut="imagen_0()" onMouseDown="inicio()">function inicio() {window.frames["contenido2"].location.href = "inicio2.htm";document.getElementById('banner').src='img/imagenes/banner.gif';document.getElementById('imagen').src='img/mapa1.gif'; }function imagen_0(){document.getElementById('imagen').src='img/mapa.gif';document.getElementById('flecha1').src='img/imagenes/flecha.gif';document.getElementById('flecha2').src='img/imagenes/flecha.gif';fintextointermitente();window.frames["contenido"].location.href = "inicio.htm";}function imagen_a(){document.getElementById('imagen').src='img/mapa1.gif';inter();window.frames["contenido"].location.href = "inicio_a.htm";document.getElementById('flecha1').src='img/imagenes/flecha_b.gif';document.getElementById('flecha2').src='img/imagenes/flecha_b.gif';} ¿Alguien puede decirme que ésta mal?¿Hay otra manera de hacerlo?
Saludos y gracias :hola:
hano:
Puedes probar a llevar una variable que almacene si se ha hecho onMouseDown para controlar el cambio de imágenes.
zaida20:
Hola hano:
Perdona mi ignoracia, pero podías ponerme un ejemplo de como se hace?
Saludos y gracias :hola:
LeGatoRojo:
como se llama el objeo imagen que quieres utilizar, o es tan solo un codigo muestra??
zaida20:
Mira te explico, en realidad es una imagen dividida en seis parte, cada parte tiene una zona interactiva donde tengo colocados los eventos, aquí te dejo todo el código:
--- Código: Text ---function inicio(){window.frames["contenido2"].location.href = "inicio2.htm";//manda el iframe al archivo inicio2.htmdocument.getElementById('banner').src='img/imagenes/banner.gif';//cambia el bannerdocument.getElementById('imagen').src='img/mapa1.gif';//cambia el mapa }function que(){window.frames["contenido2"].location.href = "que.htm";//manda el iframe al archivo que.htmdocument.getElementById('banner').src='img/banner_que.gif';//cambia el bannerdocument.getElementById('imagen').src='img/mapa4.gif';//cambia el mapa }function campana(){window.frames["contenido2"].location.href = "campana_especial.htm";//manda el iframe al archivo campana_especial.htmdocument.getElementById('banner').src='img/banner_campana.gif';//cambia el bannerdocument.getElementById('imagen').src='img/mapa3.gif';//cambia el mapa }function asesor(){window.frames["contenido2"].location.href = "contactar.htm";//manda el iframe al archivo contactar.htmdocument.getElementById('banner').src='img/banner_asesor.gif';//cambia el bannerdocument.getElementById('imagen').src='img/mapa6.gif';//cambia el mapa }function quienes(){window.frames["contenido2"].location.href = "quienes.htm";//manda el iframe al archivo quienes.htmdocument.getElementById('banner').src='img/banner_quienes.gif';//cambia el bannerdocument.getElementById('imagen').src='img/mapa2.gif';//cambia el mapa }var mostrar=false; function inter()//hace intermitente el texto (clikee){ col= (mostrar) ? '#000000' : '#9933ff'; document.getElementById('clikee').style.color=col; mostrar = !mostrar; int1=setTimeout('inter()',500); } function fintextointermitente()//para el texto intermitente{clearTimeout(int1);document.getElementById('clikee').style.color="#000000";} function imagen_0(){document.getElementById('imagen').src='img/mapa.gif';document.getElementById('flecha1').src='img/imagenes/flecha.gif';document.getElementById('flecha2').src='img/imagenes/flecha.gif';fintextointermitente();window.frames["contenido"].location.href = "inicio.htm";}function imagen_1(){document.getElementById('imagen').src='img/mapa.gif';document.getElementById('flecha1').src='img/imagenes/flecha.gif';document.getElementById('flecha2').src='img/imagenes/flecha.gif';fintextointermitente();window.frames["contenido"].location.href = "inicio.htm";}function imagen_2(){document.getElementById('imagen').src='img/mapa.gif';document.getElementById('flecha1').src='img/imagenes/flecha.gif';document.getElementById('flecha2').src='img/imagenes/flecha.gif';fintextointermitente();window.frames["contenido"].location.href = "inicio.htm";}function imagen_3(){document.getElementById('imagen').src='img/mapa.gif';document.getElementById('flecha1').src='img/imagenes/flecha.gif';document.getElementById('flecha2').src='img/imagenes/flecha.gif';fintextointermitente();window.frames["contenido"].location.href = "inicio.htm";}function imagen_4(){document.getElementById('imagen').src='img/mapa.gif';document.getElementById('flecha1').src='img/imagenes/flecha.gif';document.getElementById('flecha2').src='img/imagenes/flecha.gif';fintextointermitente();window.frames["contenido"].location.href = "inicio.htm";}function imagen_5(){document.getElementById('imagen').src='img/mapa.gif';document.getElementById('flecha1').src='img/imagenes/flecha.gif';document.getElementById('flecha2').src='img/imagenes/flecha.gif';fintextointermitente();window.frames["contenido"].location.href = "inicio.htm";} function imagen_a(){document.getElementById('imagen').src='img/mapa1.gif';inter();window.frames["contenido"].location.href = "inicio_a.htm";document.getElementById('flecha1').src='img/imagenes/flecha_b.gif';document.getElementById('flecha2').src='img/imagenes/flecha_b.gif';}function imagen_b(){document.getElementById('imagen').src='img/mapa2.gif';inter();document.getElementById('flecha1').src='img/imagenes/flecha_b.gif';document.getElementById('flecha2').src='img/imagenes/flecha_b.gif';window.frames["contenido"].location.href = "inicio_b.htm";}function imagen_c(){document.getElementById('imagen').src='img/mapa3.gif';inter();window.frames["contenido"].location.href = "inicio_c.htm";document.getElementById('flecha1').src='img/imagenes/flecha_b.gif';document.getElementById('flecha2').src='img/imagenes/flecha_b.gif';}function imagen_d(){document.getElementById('imagen').src='img/mapa4.gif';inter();window.frames["contenido"].location.href = "inicio_d.htm";document.getElementById('flecha1').src='img/imagenes/flecha_b.gif';document.getElementById('flecha2').src='img/imagenes/flecha_b.gif';}function imagen_e(){document.getElementById('imagen').src='img/mapa5.gif';inter();window.frames["contenido"].location.href = "inicio_e.htm";document.getElementById('flecha1').src='img/imagenes/flecha_b.gif';document.getElementById('flecha2').src='img/imagenes/flecha_b.gif';}function imagen_f(){document.getElementById('imagen').src='img/mapa6.gif';inter();window.frames["contenido"].location.href = "inicio_f.htm";document.getElementById('flecha1').src='img/imagenes/flecha_b.gif';document.getElementById('flecha2').src='img/imagenes/flecha_b.gif';} <img src="img/mapa.gif" name="imagen" width="184" height="121" border="0" usemap="#Map" id="imagen" style="cursor: pointer" href="#"> <map name="Map"> <area shape="rect" coords="-2,-5,59,61" onMouseOver="imagen_a()" onMouseOut="imagen_0()" onMouseDown="inicio()"> <area shape="rect" coords="60,-14,119,61" onMouseDown="quienes()" onMouseOver="imagen_b()" onMouseOut="imagen_1()"> <area shape="rect" coords="121,-36,222,62" onMouseOver="imagen_c()" onMouseOut="imagen_2()" onMouseDown="campana()"> <area shape="rect" coords="-37,63,59,162" onMouseOver="imagen_d()" onMouseOut="imagen_3()"onMouseDown="que()"> <area shape="rect" coords="60,63,119,163" onMouseOver="imagen_e()" onMouseOut="imagen_4()" onMouseDown="referencias()"> <area shape="rect" coords="121,63,221,163" onMouseOver="imagen_f()" onMouseOut="imagen_5()" onMouseDown="asesor()"></map>
Saludos y muchas gracias :hola:
Navegación
[#] Página Siguiente
Ir a la versión completa