JQuery - Wie behebe ich dieses Bild Prolongation?

Question

Hallo Leute Ich habe diesen kleinen JQuery-Skript: Linktext

$(document).ready(function() 
{
      $('#image p').hide();

      $('img').hover(function()
      {
            $('#image p').show(200); 
      }, function()
      {
            $('#image p').hide(200); 
      });
}); 

I funktioniert gut, aber ich möchte über den Text im Bild, ich jedes Mal, mich schweben können versuchen, es hält nur „Prellen“

Jede Hilfe ist sehr geschätzt, Vielen Dank, Keith

Answer 1

Gute Frage.

Das Problem scheint zu sein, dass, wenn die Maus über den Absatz ist, die Maus ist nicht mehr auf das Bild. So ist der Absatz versteckt. Wenn der Absatz ausgeblendet ist, ist die Maus wieder auf das Bild, und so wird der Absatz wieder gezeigt. Und so weiter ...

Eine gute Lösung ist MouseEnter- zu verwenden und Leave Ereignisse statt Mouseover- und mouseout:

$(document).ready(function(){
    $('#image p').hide();

    $('#image').bind("mouseenter", (function(){
        $('#image p').show(200)
     }));

    $('#image').bind("mouseleave", (function(){
        $('#image p').hide(200)
     }));

});

Der wesentliche Unterschied zwischen MouseEnter- / mouseleave Veranstaltungen und Mouseover / mouseout Veranstaltungen ist, dass erstere nicht Blase.

In diesem Beispiel wird das Kind Absatz von div # Bild erhält immer noch die MouseEnter- / mouseleave Ereignisse (auch wenn Sie nicht für sie hören), aber die Ereignisse nicht Blase bis zu ihrem Elternelement. Siehe diese Seite Vordergrund Diskussion über sie erweitert.

Sie müssen auch nicht mehr zu dem img-Tag das Ereignis zuzuordnen, sondern der enthält div. Es sollte kein Problem sein.