(AYUDA) No puedo hacer que funcione el "hover" de forma correcta

[campos22ale]

Hola gente! soy nuevo en el foro.
Quería ver si pueden ayudar con mi codigo javascript con la libreria jQuery.
Es el primer codigo que hago en js.

Logré que al poner el mouse y sacarlo sobre una imagen salga una capa arriba con un texto arriba... algo que se encuentra hecho pero yo quería intentar hacer algo sencillo por mi cuenta para aprender.

El problema es que funciona bien en todos las imágenes excepto la primera que encuentra en el codigo... medio que se traba la animacion si paso de una a otra.
en este caso la imagen que falla es 'quintaelrefugio.jpg'

Les dejo el código JS:

Código Javascript:

<script>
    $(function(){
            var caja= $("#caja");
            var target = null;
            $(".img_hover a").hover(function(e){ ////efecto del evento mousehover
                target = $(this);
            ****$(target[0].firstElementChild).slideDown(200);
            }, function(){ //efecto del evento mouseout
                $(target[0].firstElementChild).fadeOut(200, function(){
                    caja.css("display","none");
                });
            });
    });
</script>
 

Código HTML:

Código HTML:

<section> 
            <article class="img_hover">
                <a href="#">
                <div id="caja">
                    <p>Quinta El Refugio</p>
                    <span class="asd">más información</span>                
                </div>
                <img src="img/quintaelrefugio.jpg" alt="Quinta el Refufio">
                </a>
            </article> 
            
            <article class="img_hover">
                <a href="#">
              <div id="caja">
                    <p>QVEF!</p>
                    <span class="asd">más información</span>                
                </div>
                <img src="img/qvef.jpg" alt="QVEF">
                </a>
            </article>       
       </section>
 

Espero que se entienda y me puedan ayudar. Gracias.

[razpeitia]

Java != JavaScript

Movido desde Java.

[caricatos]

Hola:

El tema original lo hemos movido al foro jquery, ya que tu planteamiento es para esa librería (con javascript hablaríamos del evento mouseover). El tema original sigue aquí: (AYUDA) No puedo hacer que funcione el "hover" de forma correcta

Procura no repetir temas.

Saludos