В контексте предыдущего вопроса: -
Держите второй div видимым, если мышь находится над первым или вторым div
Как можно сделать так, чтобы второй div отображался после некоторой задержки (1 секунда), а затем сохранял div видимым, если мышь находится над первым или вторым div.
Я сделал некоторый прогресс, но он не работает. Почему это не работает?
Текущий прогресс :-
var display = false;
$(".the-dropdown, .menu-item").hover(function () {
display = true;
setTimeout(function () {
show_sub_menu($(this));
}, 1000);
}, function () {
display = false;
setTimeout(function () {
hide_sub_menu($(this));
}, 1000);
});
function show_sub_menu(obj) {
//alert(obj); // debugging
if (display === true) {
obj.show();
}
}
function hide_sub_menu(obj) {
if (display === false) {
obj.hide();
}
}
Для тех, кто ищет ответ на этот вопрос:
var display = false;
$(".the-dropdown, .menu-item").hover(function () {
display = true;
setTimeout(function () {
if (display === true) {
$('.the-dropdown').show();
}
}, 300);
}, function () {
display = false;
setTimeout(function () {
if (display === false) {
$('.the-dropdown').hide();
}
}, 100);
});
TRY Это: DEMO
$('.menu-item , .the-dropdown').hover(
function(){
$("div.the-dropdown").delay('1000').show();
}
, function(){
$("div.the-dropdown").delay('1000').hide();
}
);