Наведите указатель мыши на div для отображения текста в выпуске jquery

Question

У меня проблема здесь.Когда моя мышь наводится на элемент div, в элементе div появляется текст.И когда он находится на указателе мыши из div, текст исчезнет.Моя проблема, однако, заключается в том, что когда мышь находится над отображаемым текстом, она будет считать, что она находится вне элемента div, и текст исчезнет.Как я могу сделать, чтобы избежать этого?Я хочу, чтобы текст оставался до тех пор, пока мышь находится в элементе div, даже если он находится над текстом.Спасибо ..

<div class="passd"></div>

    $('.passd').live("mouseover", function(){
  if($(this).children('#passopt').length==0){
   $(this).append('<p id="passopt">appear text</p>');
  }
 });
 $('.passd').live("mouseout", function(){
  $(this).children('#passopt').remove();
 });

Answer 1

Попробуйте это:

$('.passd')
    .live("mouseenter", function() {
        $(this).append('<p id="passopt">appear text</p>');
    })
    .live("mouseleave", function() {
        $(this).children('#passopt').remove();
    });

Проверено, и работает: http://jsfiddle.net/xLzdP/

Answer 2

вместо этого вы можете использовать событие mouseleave ...

http://api.jquery.com/mouseleave/

Answer 3

С помощью .hover () вы можете достичь такого же результата:

    $('.passd').hover(function() {
        $(this).append('<p id="passopt">appear text</p>');
}, function(){
        $(this).children('#passopt').remove();
    });

Answer 4

Проверьте http://flowplayer.org/tools/tooltip/index.html, чтобы увидеть, может ли он делать то, что вы хотите ...