• Viernes 8 de Noviembre de 2024, 07:43
« anterior próximo »
Páginas: [1]

Autor Tema:  Problema Con Onmouseover, Onmouseout Y Onmousedown  (Leído 3278 veces)

zaida20

  • Miembro MUY activo
  • ***
  • Mensajes: 213
    • Ver Perfil
Problema Con Onmouseover, Onmouseout Y Onmousedown
« en: Miércoles 8 de Agosto de 2007, 15:15 »
0
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
  1.  
  2. <img onMouseOver="imagen_a()" onMouseOut="imagen_0()"  onMouseDown="inicio()">
  3. function inicio()
  4.  
  5. {
  6. window.frames["contenido2"].location.href = "inicio2.htm";
  7. document.getElementById('banner').src='img/imagenes/banner.gif';
  8. document.getElementById('imagen').src='img/mapa1.gif';
  9.  
  10. }
  11. function imagen_0()
  12. {
  13. document.getElementById('imagen').src='img/mapa.gif';
  14. document.getElementById('flecha1').src='img/imagenes/flecha.gif';
  15. document.getElementById('flecha2').src='img/imagenes/flecha.gif';
  16. fintextointermitente();
  17. window.frames["contenido"].location.href = "inicio.htm";
  18. }
  19. function imagen_a()
  20. {
  21. document.getElementById('imagen').src='img/mapa1.gif';
  22. inter();
  23. window.frames["contenido"].location.href = "inicio_a.htm";
  24. document.getElementById('flecha1').src='img/imagenes/flecha_b.gif';
  25. document.getElementById('flecha2').src='img/imagenes/flecha_b.gif';
  26. }
  27.  
¿Alguien puede decirme que ésta mal?¿Hay otra manera de hacerlo?
Saludos y gracias  :hola:
---- Las oportunidades que se te presentan son las que son y ellas te llevarán a la felicidad ----

hano

  • Miembro activo
  • **
  • Mensajes: 87
    • Ver Perfil
Re: Problema Con Onmouseover, Onmouseout Y Onmousedown
« Respuesta #1 en: Miércoles 8 de Agosto de 2007, 16:16 »
0
Puedes probar a llevar una variable que almacene si se ha hecho onMouseDown para controlar el cambio de imágenes.
                                                                                               
Para programadores
http]
[url=https://hardprogrammer.blogspot.com]https]

zaida20

  • Miembro MUY activo
  • ***
  • Mensajes: 213
    • Ver Perfil
Re: Problema Con Onmouseover, Onmouseout Y Onmousedown
« Respuesta #2 en: Jueves 9 de Agosto de 2007, 10:58 »
0
Hola hano:

Perdona mi ignoracia, pero podías ponerme un ejemplo de como se hace?

Saludos y gracias  :hola:
---- Las oportunidades que se te presentan son las que son y ellas te llevarán a la felicidad ----

LeGatoRojo

  • Miembro HIPER activo
  • ****
  • Mensajes: 552
  • Nacionalidad: mx
    • Ver Perfil
    • LeGatoRojo
Re: Problema Con Onmouseover, Onmouseout Y Onmousedown
« Respuesta #3 en: Jueves 9 de Agosto de 2007, 17:59 »
0
como se llama el objeo imagen que quieres utilizar, o es tan solo un codigo muestra??
Un día desperte y en lugar de dientes tenía colmillos, en lugar de manos, tenía garras; pero lo más impactante fue el color escarlata de mi pelaje.

zaida20

  • Miembro MUY activo
  • ***
  • Mensajes: 213
    • Ver Perfil
Re: Problema Con Onmouseover, Onmouseout Y Onmousedown
« Respuesta #4 en: Jueves 9 de Agosto de 2007, 18:04 »
0
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
  1. function inicio()
  2. {
  3. window.frames["contenido2"].location.href = "inicio2.htm";//manda el iframe al archivo inicio2.htm
  4. document.getElementById('banner').src='img/imagenes/banner.gif';//cambia el banner
  5. document.getElementById('imagen').src='img/mapa1.gif';//cambia el mapa
  6.  
  7. }
  8. function que()
  9. {
  10. window.frames["contenido2"].location.href = "que.htm";//manda el iframe al archivo que.htm
  11. document.getElementById('banner').src='img/banner_que.gif';//cambia el banner
  12. document.getElementById('imagen').src='img/mapa4.gif';//cambia el mapa
  13.  
  14. }
  15. function campana()
  16. {
  17. window.frames["contenido2"].location.href = "campana_especial.htm";//manda el iframe al archivo campana_especial.htm
  18. document.getElementById('banner').src='img/banner_campana.gif';//cambia el banner
  19. document.getElementById('imagen').src='img/mapa3.gif';//cambia el mapa
  20.  
  21. }
  22. function asesor()
  23. {
  24. window.frames["contenido2"].location.href = "contactar.htm";//manda el iframe al archivo contactar.htm
  25. document.getElementById('banner').src='img/banner_asesor.gif';//cambia el banner
  26. document.getElementById('imagen').src='img/mapa6.gif';//cambia el mapa
  27.  
  28. }
  29. function quienes()
  30. {
  31. window.frames["contenido2"].location.href = "quienes.htm";//manda el iframe al archivo quienes.htm
  32. document.getElementById('banner').src='img/banner_quienes.gif';//cambia el banner
  33. document.getElementById('imagen').src='img/mapa2.gif';//cambia el mapa
  34.  
  35. }
  36. var mostrar=false;
  37.  
  38. function inter()//hace intermitente el texto (clikee)
  39. {
  40. col= (mostrar) ? '#000000' : '#9933ff';
  41. document.getElementById('clikee').style.color=col;
  42. mostrar = !mostrar;
  43. int1=setTimeout('inter()',500);
  44. }
  45. function fintextointermitente()//para el texto intermitente
  46. {
  47. clearTimeout(int1);
  48. document.getElementById('clikee').style.color="#000000";
  49. }
  50. function imagen_0()
  51. {
  52. document.getElementById('imagen').src='img/mapa.gif';
  53. document.getElementById('flecha1').src='img/imagenes/flecha.gif';
  54. document.getElementById('flecha2').src='img/imagenes/flecha.gif';
  55. fintextointermitente();
  56. window.frames["contenido"].location.href = "inicio.htm";
  57. }
  58. function imagen_1()
  59. {
  60. document.getElementById('imagen').src='img/mapa.gif';
  61. document.getElementById('flecha1').src='img/imagenes/flecha.gif';
  62. document.getElementById('flecha2').src='img/imagenes/flecha.gif';
  63. fintextointermitente();
  64. window.frames["contenido"].location.href = "inicio.htm";
  65. }
  66. function imagen_2()
  67. {
  68. document.getElementById('imagen').src='img/mapa.gif';
  69. document.getElementById('flecha1').src='img/imagenes/flecha.gif';
  70. document.getElementById('flecha2').src='img/imagenes/flecha.gif';
  71. fintextointermitente();
  72. window.frames["contenido"].location.href = "inicio.htm";
  73. }
  74. function imagen_3()
  75. {
  76. document.getElementById('imagen').src='img/mapa.gif';
  77. document.getElementById('flecha1').src='img/imagenes/flecha.gif';
  78. document.getElementById('flecha2').src='img/imagenes/flecha.gif';
  79. fintextointermitente();
  80. window.frames["contenido"].location.href = "inicio.htm";
  81. }
  82. function imagen_4()
  83. {
  84. document.getElementById('imagen').src='img/mapa.gif';
  85. document.getElementById('flecha1').src='img/imagenes/flecha.gif';
  86. document.getElementById('flecha2').src='img/imagenes/flecha.gif';
  87. fintextointermitente();
  88. window.frames["contenido"].location.href = "inicio.htm";
  89. }
  90. function imagen_5()
  91. {
  92. document.getElementById('imagen').src='img/mapa.gif';
  93. document.getElementById('flecha1').src='img/imagenes/flecha.gif';
  94. document.getElementById('flecha2').src='img/imagenes/flecha.gif';
  95. fintextointermitente();
  96. window.frames["contenido"].location.href = "inicio.htm";
  97. }
  98.  
  99. function imagen_a()
  100. {
  101. document.getElementById('imagen').src='img/mapa1.gif';
  102. inter();
  103. window.frames["contenido"].location.href = "inicio_a.htm";
  104. document.getElementById('flecha1').src='img/imagenes/flecha_b.gif';
  105. document.getElementById('flecha2').src='img/imagenes/flecha_b.gif';
  106. }
  107. function imagen_b()
  108. {
  109. document.getElementById('imagen').src='img/mapa2.gif';
  110. inter();
  111. document.getElementById('flecha1').src='img/imagenes/flecha_b.gif';
  112. document.getElementById('flecha2').src='img/imagenes/flecha_b.gif';
  113. window.frames["contenido"].location.href = "inicio_b.htm";
  114. }
  115. function imagen_c()
  116. {
  117. document.getElementById('imagen').src='img/mapa3.gif';
  118. inter();
  119. window.frames["contenido"].location.href = "inicio_c.htm";
  120. document.getElementById('flecha1').src='img/imagenes/flecha_b.gif';
  121. document.getElementById('flecha2').src='img/imagenes/flecha_b.gif';
  122. }
  123. function imagen_d()
  124. {
  125. document.getElementById('imagen').src='img/mapa4.gif';
  126. inter();
  127. window.frames["contenido"].location.href = "inicio_d.htm";
  128. document.getElementById('flecha1').src='img/imagenes/flecha_b.gif';
  129. document.getElementById('flecha2').src='img/imagenes/flecha_b.gif';
  130. }
  131. function imagen_e()
  132. {
  133. document.getElementById('imagen').src='img/mapa5.gif';
  134. inter();
  135. window.frames["contenido"].location.href = "inicio_e.htm";
  136. document.getElementById('flecha1').src='img/imagenes/flecha_b.gif';
  137. document.getElementById('flecha2').src='img/imagenes/flecha_b.gif';
  138. }
  139. function imagen_f()
  140. {
  141. document.getElementById('imagen').src='img/mapa6.gif';
  142. inter();
  143. window.frames["contenido"].location.href = "inicio_f.htm";
  144. document.getElementById('flecha1').src='img/imagenes/flecha_b.gif';
  145. document.getElementById('flecha2').src='img/imagenes/flecha_b.gif';
  146. }
  147.  
  148.                       <img src="img/mapa.gif" name="imagen" width="184" height="121" border="0" usemap="#Map" id="imagen" style="cursor: pointer" href="#">
  149.                       <map name="Map">
  150.                         <area shape="rect" coords="-2,-5,59,61" onMouseOver="imagen_a()" onMouseOut="imagen_0()"  onMouseDown="inicio()">
  151.                         <area shape="rect" coords="60,-14,119,61" onMouseDown="quienes()" onMouseOver="imagen_b()" onMouseOut="imagen_1()">
  152.                         <area shape="rect" coords="121,-36,222,62" onMouseOver="imagen_c()" onMouseOut="imagen_2()" onMouseDown="campana()">
  153.                         <area shape="rect" coords="-37,63,59,162" onMouseOver="imagen_d()" onMouseOut="imagen_3()"onMouseDown="que()">
  154.                         <area shape="rect" coords="60,63,119,163" onMouseOver="imagen_e()" onMouseOut="imagen_4()" onMouseDown="referencias()">
  155.                         <area shape="rect" coords="121,63,221,163" onMouseOver="imagen_f()" onMouseOut="imagen_5()" onMouseDown="asesor()"></map>
  156.  
  157.  

Saludos y muchas gracias  :hola:
---- Las oportunidades que se te presentan son las que son y ellas te llevarán a la felicidad ----

zaida20

  • Miembro MUY activo
  • ***
  • Mensajes: 213
    • Ver Perfil
Re: Problema Con Onmouseover, Onmouseout Y Onmousedown
« Respuesta #5 en: Lunes 13 de Agosto de 2007, 13:42 »
0
Nadie puede darme una idea para hacerlo ?  :(
saludos :hola:
---- Las oportunidades que se te presentan son las que son y ellas te llevarán a la felicidad ----

F_Tanori

  • Moderador
  • ******
  • Mensajes: 1919
  • Nacionalidad: mx
    • Ver Perfil
Re: Problema Con Onmouseover, Onmouseout Y Onmousedown
« Respuesta #6 en: Lunes 13 de Agosto de 2007, 15:27 »
0
utilizas document.getElementById para la imagen completa sin embargo

ninguna area tiene id....
Citar
<area id='imagen_area_a' shape="rect" coords="-2,-5,59,61" onMouseOver="imagen_a()" onMouseOut="imagen_0()"  onMouseDown="inicio()">


Mira esta pagina no sé si se algo como lo que buscas tal vez pueda pueda ayudarte


http://www.ryerson.ca/JavaScript/lectures/...ggleButton.html


Saludos
" ExIsTo y A vEcEs PiEnSo "

NOTA:
===========================================================================================================================
Este foro es para ayudar, aprender, compartir... usenlo para eso,
NO SE RESUELVEN DUDAS POR MENSAJE PRIVADO Y MENOS POR CORREO
===========================================================================================================================

zaida20

  • Miembro MUY activo
  • ***
  • Mensajes: 213
    • Ver Perfil
Re: Problema Con Onmouseover, Onmouseout Y Onmousedown
« Respuesta #7 en: Martes 14 de Agosto de 2007, 12:11 »
0
Muchas gracias F_Tanori:

Lo miraré y espero que me sirva
Saludos y gracias  :hola:

Una pregunta, alguien sabe dónde pueso encontrar un buena explicación sobre las variables de javascript?
---- Las oportunidades que se te presentan son las que son y ellas te llevarán a la felicidad ----

F_Tanori

  • Moderador
  • ******
  • Mensajes: 1919
  • Nacionalidad: mx
    • Ver Perfil
Re: Problema Con Onmouseover, Onmouseout Y Onmousedown
« Respuesta #8 en: Miércoles 15 de Agosto de 2007, 09:02 »
0
" ExIsTo y A vEcEs PiEnSo "

NOTA:
===========================================================================================================================
Este foro es para ayudar, aprender, compartir... usenlo para eso,
NO SE RESUELVEN DUDAS POR MENSAJE PRIVADO Y MENOS POR CORREO
===========================================================================================================================

zaida20

  • Miembro MUY activo
  • ***
  • Mensajes: 213
    • Ver Perfil
Re: Problema Con Onmouseover, Onmouseout Y Onmousedown
« Respuesta #9 en: Lunes 3 de Septiembre de 2007, 10:17 »
0
Gracias de nuevo F_Tanori  ;)
Saludos  :hola:
---- Las oportunidades que se te presentan son las que son y ellas te llevarán a la felicidad ----

F_Tanori

  • Moderador
  • ******
  • Mensajes: 1919
  • Nacionalidad: mx
    • Ver Perfil
Re: Problema Con Onmouseover, Onmouseout Y Onmousedown
« Respuesta #10 en: Lunes 3 de Septiembre de 2007, 10:29 »
0
No hay de que ;)


Saludos
" ExIsTo y A vEcEs PiEnSo "

NOTA:
===========================================================================================================================
Este foro es para ayudar, aprender, compartir... usenlo para eso,
NO SE RESUELVEN DUDAS POR MENSAJE PRIVADO Y MENOS POR CORREO
===========================================================================================================================
Páginas: [1]
« anterior próximo »