JQuery зависает до сих пор - PullRequest
Новая
       28

JQuery зависает до сих пор

1 голос
/ 10 января 2010

У меня следующая проблема. Я работаю над простой подсказкой jQuery, и теперь я имею дело с чем-то странным для меня. Каждый раз при наведении курсора мыши на элемент события как при наведении курсора, так и при отключении мыши запускаются одновременно, поэтому всплывающая подсказка исчезает (но если я продолжаю держать руку, она совершает много миганий в секунду). Вот мой код. 

  var hint = $('<div id="hint-wrap"><div id="hintbox-top"><div id="hintbox-bottom"><div id="hintbox-topleft"><div id="hintbox-bottomleft"><div id="hint-innerwrap"><div id="hint"></div></div></div></div></div></div></div>'); // Funny I know :-D

  hint.hide();
  $('body').append( hint ); // I append it

  $('.hashint').hover(function(e){   

// Set position to cursor's
hint.css( 'left', e.pageX );
hint.css( 'top', e.pageY - 60 );

// animated append
hint.css( 'opacity', 0.2 );
hint.show();
hint.animate( { 'opacity' : 1 }, 100 );

// set text
$( "#hint" , hint).html( $( '#' + $(this).attr( 'id' ) + '-hint' ).html() ); 

 },
 function(){ // there is the problem
    hint.hide();
  });

И HTML: 

<div id="usernamelabel-hint" class="hinttext">Lorem Ipsum is simply dummy text of the printing and type.Lorem. <a href="#">Sign up!</a></div> <!-- This is hint text (and code) -->
<p><label><span class="hashint" id="usernamelabel">Username</span><span class="asterisk">*</span></label> <!-- ... stuff --> </p>

Пожалуйста, кто-нибудь знает, почему событие отключения мыши все еще вызывает и скрывает мой ящик?

Большое спасибо, Ондрей

Ответы [ 2 ]

1 голос
/ 10 января 2010

Может быть, ваша всплывающая подсказка перекрывает триггер-див? В этом случае появляющаяся всплывающая подсказка-div запускает отпускание мыши по триггеру-div. По крайней мере, это то, что произошло со мной несколько div назад. Я решил эту проблему, наложив все на невидимый триггер-div - не очень красиво, но у меня получилось ..

1 голос
/ 10 января 2010

Во-первых, почему бы вам просто не вставить HTML для подсказки в документ HTML?
А в CSS вы только что установили отображение: нет?
Тогда при показе подсказки вы можете просто использовать hint.show или hint.fadeIn.

Я бы просто использовал $. Mouseenter и $. Mouseleave .

Пример: 

$.('#usernamelabel-hint').mouseenter(function() { 
  // show or fade inn hint text
});

$.('#usernamelabel-hint').mouseleave(function() {
  // Hide or fade out hinttext
});
...