2017-10-31 4 views
0

私はPHPですが、時にはJSで難しいです:)メニューがあります。ホバリング#aboutを開くと#wrapperが開きます。 $('#company-wrapper').mouseleaveの後にマウスを移動したJSまたはjQueryで確認する方法がありますか?JSまたはjQueryでチェックしてくださいmouseleaveの後にマウスを移動しました

$('#about').mouseenter(function(){ 
    $('.hide_wrap').stop(); 
    $('.hide_wrap').hide(); 
    $('#company-wrapper').slideDown(); 
}); 

$('#company-wrapper').mouseenter(function(){ 
    $(this).css('display','block'); 
    $('#about').addClass('hov'); 
}); 

$('#about').mouseleave(function(){ 
    $('#company-wrapper').css('display','none'); 
}); 

$('#company-wrapper').mouseleave(function(){ 
    $(this).css('display','none'); 
    $('#about').removeClass('hov'); 
}); 

問題は、マウスが#company-wrapperから#aboutに戻った場合、私はケースに#aboutから#company-wrapperremoveClass('hov')をクローズする必要がないことです。 とマウスが#company-wrapperからではない#aboutに移動した場合、私はそれに値をasigningで隠し入力でそれを行うために#company-wrapperremoveClass('hov')

Tryiedを閉じる必要がありますが、それは部分的に助けた - マウスが戻ってきたとき、それは#company-wrapperを閉じていませんでした#company-wrapperから#aboutまでですが、マウスが#company-wrapperから#aboutに残っていない場合、#会社ラッパーは閉じられませんでした。

答えて

0
var timer = 200; 
var timerId = setTimeout(func, timer); 
var timerId2 = setTimeout(func2, timer); 
clearTimeout(timerId); 
clearTimeout(timerId2); 
function func() { 
$('#company-wrapper').css('display','none'); 
$('#about').removeClass('hov'); 
} 

function func2() { 
$('#company-wrapper').css('display','none'); 
} 
var elem_about = document.querySelector("#about"); 
$('#about').mouseenter(function(){ 
    if ($("#id_what_open_wrapper").val()=='company-wrapper') { 
       if(elem_about.classList.contains("hov")){ 
        console.log('about has hov'); 
       }else{ 
        console.log('about has NOT hov'); 
        $('#company-wrapper').css('display','block'); 
        $('#about').addClass('hov'); 
       } 
      clearTimeout(timerId); 
      clearTimeout(timerId2); 
      $("#id_what_open_wrapper").val(''); 
    }else{ 
     clearTimeout(timerId2); 
     clearTimeout(timerId); 
     $('.hide_wrap').stop(); 
     $('.hide_wrap').hide(); 
     $('#company-wrapper').slideDown(); 
    } 
}); 

$('#company-wrapper').mouseenter(function(){ 
    clearTimeout(timerId2); 
    clearTimeout(timerId); 
    $(this).css('display','block'); 
    $('#about').addClass('hov'); 
}); 

$('#about').mouseleave(function(){ 
    timerId2 = setTimeout(func2, timer); 
    timerId = setTimeout(func, timer); 
}); 

$('#company-wrapper').mouseleave(function(){ 
    timerId = setTimeout(func, timer); 
    timerId2 = setTimeout(func2, timer); 
    $("#id_what_open_wrapper").val('company-wrapper'); 
}); 
関連する問題