Comunidad de diseño web y desarrollo en internet online

Problema con la palabra clave "this"

Citar            
MensajeEscrito el 05 Feb 2008 07:53 pm
Puede que la duda sea una tonteria, pero llevo ya unas horas trabajando en un trabajillo y me he chocado de frente con esto. El problema es que en un html he puesto:

Código :

<body>   

   <img src="fondo.gif" onmouseover="mostrar(this);" onmouseout="ocultar(this);" />
   <img src="fondo.gif" onmouseover="mostrar(this);" onmouseout="ocultar(this);" />      

      <script type="text/javascript">
      var t,o;
      
         function mostrar(obj){
               clearTimeout(t);
               obj.src="fondo2.gif";   
               }
            
         function ocultar(obj){
            obj.src="fondo.gif";
            //o = obj;
            //t = setTimeout("cerrar(o)",1000);

         }
               
         function cerrar(obj){
            obj.src="fondo.gif";
         }
         
         
      </script>


es un código muy simple, en el cual, pongo una serie de imágenes que quiero que cambien al pasar sobre ellas el cursor.
A la hora de poner el cursor sobre una imagen todo va bien, pero al salir (onmouseout), todas las imágenes reaccionan, independientemente de si era la que tenia encima el ratón o no, y la verdad no se me ocurre como puede pasar esto. Gracias de antemano.


pd: Estoy usando ASP sobre IIS en mi máquina, por si ayudara en algo.

Por mussra

100 de clabLevel

1 tutorial

 

firefox
Citar            
MensajeEscrito el 05 Feb 2008 08:11 pm
Veamos...
He probado tu código (FF 2, FF3, IE7)...
y funciona perfectamente.

¿A tí no?
:S


Lo de ASP... no lo he entendido... ¿que tu PC es un servidor que trabaja con ASP?
¿O que la página que contiene ese código, es una .asp?
(La verdad... q sobre ASP no conozco nada... pero me suena a MicroSoft, que es directamente proporcional a "problemas" y "dolores de cabeza". Aún así... no le veo mucha relación con el problema)


¿podrías poner la URL de la página completa?
Quizá se deba a algo que interactúe con el funcionamiento normal del script.

Por El Oso Amoroso

Claber

1780 de clabLevel

6 tutoriales

 

Madrid, España, Europa, Eurasia, La Tierra, Sist.Solar, Vía Láctea, UNIVERSO

firefox
Citar            
MensajeEscrito el 06 Feb 2008 12:18 pm
A lo que me refiero, es a que instalé en mi máquina el IIS (Internet Information Server que si que es de microsoft, pero es lo que me enseñan en la facultad...), y la puse como un servidor, digamos en "prácticas", y la web está hecha con ASP (Active Server Pages, tb de microsoft), pero no me funciona, puesto que a tí si te funciona, lo probaré en xwampp, a ver si va. Gracias por la respuesta.

Por mussra

100 de clabLevel

1 tutorial

 

firefox
Citar            
MensajeEscrito el 06 Feb 2008 07:25 pm

mussra escribió:

[...] es lo que me enseñan en la facultad... [...]
A ver cuándo empiezan a enseñar cosas útiles... xD

Bueno... ya nos contarás si era culpa (o relación) del ASP, o si por el contrario, no tiene que ver... en cuyo caso, lo que ya te dige... pon el código entero (mejor la URL, si es ASP), para ver si hay "otra cosa" por ahí que sea la culpable de comportamiento "inesperado" de tu script.

Suerte.

Por El Oso Amoroso

Claber

1780 de clabLevel

6 tutoriales

 

Madrid, España, Europa, Eurasia, La Tierra, Sist.Solar, Vía Láctea, UNIVERSO

firefox
Citar            
MensajeEscrito el 06 Feb 2008 07:34 pm
No tiene nada que ver que sea ASP o IIS, si su problema es con javascript, prueba colocando un id antes de hacer la llamada, y en el javascript usar getElementById, mira:

Código :

<html>
<head>
<title>Cualquier cosa</title>
// Pon el javascript aquí, no en body
<script language="javascript">      
var t,o;
function mostrar(obj)
{
    clearTimeout(t);
    getElementById(obj).src="fondo2.gif";
}

function ocultar(obj)
{
     getElementById(obj).src="fondo.gif";
     //o = obj;
     //t = setTimeout("cerrar(o)",1000);
}
function cerrar(obj)
{
     getElementById(obj).src="fondo.gif";
}
</script>
</head>
<body>
<img src="fondo.gif" id="imagen1" onmouseover="mostrar(this);" onmouseout="ocultar(this);" />
<img src="fondo.gif" id="imagen2" onmouseover="mostrar(this);" onmouseout="ocultar(this);" />
......


Tu problema radica en que estás usando también el estilo Microsoft de trabajar con javascript.

Por Kamina Sama

16 de clabLevel



 

msie
Citar            
MensajeEscrito el 06 Feb 2008 07:38 pm
Por cierto, si lo que vas a hacer es ocultar algo, puedes hacerlo por javascript y css, por ejemplo:

Código :

function ocultar(obj)
{
    document.getElementById(obj).style.visibility = "hidden";
}


Por cierto, me falto en el mensaje de arriba el objeto document, tal como se menciona aquí.

Por Kamina Sama

16 de clabLevel



 

msie
Citar            
MensajeEscrito el 06 Feb 2008 08:17 pm
Kamina Sama, lo que has puesto, no funciona... ni una cosa, ni la otra...
Y o se me ha olvidado lo poco que sabía... o te veo un poco despistado.

¿Cuál es el "estilo Microsoft de trabajar con javascript"?
:S

De hecho, el código original de mussra, ya digo, funciona perfectamente (IE7, y FF2).
Para que funcionara tu código, aparte del "id" que indicas, debería de ponerse:
onmouseover="mostrar(this);" onmouseout="ocultar(this);"

Por El Oso Amoroso

Claber

1780 de clabLevel

6 tutoriales

 

Madrid, España, Europa, Eurasia, La Tierra, Sist.Solar, Vía Láctea, UNIVERSO

firefox
Citar            
MensajeEscrito el 06 Feb 2008 11:08 pm
Hola Rizome, veo que no leiste todo el código completo, si funciona y es más compatible que el código anterior. de hecho sería

Código :

onmouseover="javascript:mostrar(this.id);" onmouseout="javascript:ocultar(this.id);"
. Tampoco leíste cuando hice la aclaración de que debe llevar el document al principio.

NOTA: Olvide mencionar el this.id, detalles cuando no tienes mucho tiempo para responder por andar en la calle con un equipo.

Código :

function mostrar(obj)
{
    clearTimeout(t);
    document.getElementById(obj).src="fondo2.gif";
}

function ocultar(obj)
{
     document.getElementById(obj).src="fondo.gif";
     //o = obj;
     //t = setTimeout("cerrar(o)",1000);
}
function cerrar(obj)
{
     document.getElementById(obj).src="fondo.gif";
}


Con estilo Microsoft me refiero a hacer esto objeto.propiedad que funciona bien en algunos casos, más no en todos. Ambos necesitan leer un poco más del DOM.

Por Kamina Sama

16 de clabLevel



 

firefox
Citar            
MensajeEscrito el 06 Feb 2008 11:10 pm
Lo de objeto.propiedad lo dije especificamente en el caso de objetos javascript. En donde comúnmente es contenedor.objeto.propiedad ¡Rayos!

Por Kamina Sama

16 de clabLevel



 

firefox
Citar            
MensajeEscrito el 07 Feb 2008 12:35 am
Bueno... La verdad que no soy un experto en DOM, pero hasta donde sé, "document.getElementById(this.id)==this"
de manera que "document.getElementById(this.id).src=this.src".

El problema, es que "document.getElementById(this.id)" no funciona en navegadores anteriores al IE5 (creo recordar), no así el objeto "this", que no es más que una llamada a sí mismo.

En cualquier caso, quedamos pendientes de la declaración de mussra, de si el código que tenía funciona o no en su página .ASP, pues la muestra que puso, trabaja a la perfección en un .HTML, con IE7, FF2 y FF3

Por El Oso Amoroso

Claber

1780 de clabLevel

6 tutoriales

 

Madrid, España, Europa, Eurasia, La Tierra, Sist.Solar, Vía Láctea, UNIVERSO

firefox
Citar            
MensajeEscrito el 07 Feb 2008 12:56 am
Kamina Sama

No hay una forma de hacer al estilo Microsoft partiendo de que tanto el DOM como Javascript son lenguajes ajenos al mismo, y este es el que los acoge por lo tanto son "estándares", entre muchas comillas.

En cuanto a la mejor forma de ponerlo, como dijo rizome es exactamente igual.

document.getElementById(objeto)

Es exactamente igual que activar this desde un evento

Ya que lo que hace este this es pasar la referencia del id a través de un parámetro de función, que es el que almacena esta información haciendo que la función o el proceso al que se refiera pueda señalizar hacia una parte única e idente del código

Por Avaltel 2.0

22 de clabLevel



 

firefox
Citar            
MensajeEscrito el 07 Feb 2008 04:46 pm
Pues la verdad, lo probé en un html y me siguió provocando el mismo error, entonces pensé, que podría ser (a lo mejor), de la misma imagen, y así es. No se por qué, pero lo explicaré lo mejor que pueda. Resulta que queria crear un efecto fade in (y fade out), en mis botonones usando javascript, para ello me creé las dos animaciones correspondientes en sendos .gifs ... la prueba fue, poner otra imagen cualquiera, (en mi caso un .png en cada imagen), y asi ha funcionado como ya dijiste tú rizome, lo que demuestra a su vez que no es por ASP. Ahora la duda es... ¿y por qué no funciona con la animación creada con el gif???. La verdad es que esto a mi me confunde aun más.

Por mussra

100 de clabLevel

1 tutorial

 

firefox
Citar            
MensajeEscrito el 07 Feb 2008 05:18 pm
Bueno aquí tenéis los ejemplos: (Lo siento por la publi, el hosting gratuito...)

En este ejemplo, veréis como al hacer mouseout se modifican ambas imágenes...
Con el problema

En este otro en cambio, no sucede.
Sin el problema


Gracias por interesaros tanto.

Por mussra

100 de clabLevel

1 tutorial

 

firefox
Citar            
MensajeEscrito el 07 Feb 2008 05:47 pm
Así explicado, mucho mejor.
La verdad... que sí que es RARO...
Y no le encuentro explicación.
(seguro que si se pasa por aquí Lunatic Lycanthrop, encuentra la razón del fallo enseguida)

Pero de momento, te sugiero otra manera, más configurable, y que no usa "animaciones gifs" (que temo sean la razón de los problemas)
... hace un par de días, contesté un hilo con un objetivo similar.
UN BOTÓN QUE HACE UN FADEOUT EN ONMOUSEOUT
Pero no lo encuentro... si no das con él, y esta noche tengo tiempo, lo vuelvo a buscar. No puede andar muy lejos.

Por El Oso Amoroso

Claber

1780 de clabLevel

6 tutoriales

 

Madrid, España, Europa, Eurasia, La Tierra, Sist.Solar, Vía Láctea, UNIVERSO

firefox
Citar            
MensajeEscrito el 07 Feb 2008 05:52 pm
Lo encointré.


Unos post más abajo, cómo no, Lunatic Lycanthrop da una solución aternativa, y algo más ligera.
(aunque usa jQuery, cosa que no es muy de mi estilo...)

Por El Oso Amoroso

Claber

1780 de clabLevel

6 tutoriales

 

Madrid, España, Europa, Eurasia, La Tierra, Sist.Solar, Vía Láctea, UNIVERSO

firefox
Citar            
MensajeEscrito el 07 Feb 2008 06:15 pm
Muchas gracias, me olvidaré de los gifs, esta forma es mucho más eficiente, y más elegante. Por cierto, yo tb prefiero no usar JQuery, de hecho ni siquiera se usarlo...

Por mussra

100 de clabLevel

1 tutorial

 

firefox
Citar            
MensajeEscrito el 07 Feb 2008 08:11 pm

mussra escribió:

[...] de hecho ni siquiera se usarlo...
Copiando el código que indica Lunatic Lycanthrop unos post más abajo del mío, te funcionría también.
Pero el problema, es ese. Usar, o no usar, cosas que no se dominan completamente.
Yo... prefiero evitarlas en la medida de lo posible... aunque hay que reconocer, que jQuery ofrece soluciones increíbles en algunos casos.

Por El Oso Amoroso

Claber

1780 de clabLevel

6 tutoriales

 

Madrid, España, Europa, Eurasia, La Tierra, Sist.Solar, Vía Láctea, UNIVERSO

firefox

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.