Я хочу, чтобы div показывал при наведении мыши на другую, и автоматически выводил ее через несколько секунд с помощью jquery - PullRequest
0 голосов
/ 11 декабря 2010

сначала вот мой HTML-код:

<div class="outter">
    <div class="item"></div>
    <div class="item"></div>
    <div class="item"></div>
    <div class="item"></div>
</div>
<div class="inner"></div>

когда моя мышь указывает на «элемент», показывается «внутренний», а при наведении курсора на «внутренний» исчезает:

$(".item").hover(function(){
   // setTimeout(function(){$('.inner').hide('slow');},2000);
   $('.inner').show('slow');
},function(){
    $('.inner').stop(true, true).hide('slow');
})

также, я хочу, чтобы при показе «inner» он исчезал автоматически через несколько секунд

поэтому я пишу setTimeout (function () {$ ('. Inner'). Hide ('slow');}, 2000); как примечание в коде выше

но результат неудачен, здесь он-лайн случай он не может сбросить "settimeout", когда наведен курсор на другой "элемент", так как я могу решить проблему?

Спасибо!

Ответы [ 2 ]

1 голос
/ 11 декабря 2010

Попробуйте поставить clearTimeout (mytime);в качестве первой строки в функции второго параметра вашего .hover.

$(".item").hover(function(){
   myTime = setTimeout(function(){$('.inner').hide('slow');},2000);
   $('.inner').show('slow');
},function(){
    clearTimeout(myTime);
    $('.inner').stop(true, true).hide('slow');
})

Этот код не был проверен, но должен отправить вас в правильном направлении ... Я надеюсь.

0 голосов
/ 11 декабря 2010

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

$(".item").hover(function() {
$('.inner').show('slow');}, 
function() {var timer = setTimeout(function() {
clearTimeout(timer);
$('.inner').stop(true, true).hide('slow');
}, 2000);
});

Отредактировано, чтобы исправить ошибку с моей стороны ... http://jsfiddle.net/3p4MU/10/

...