Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 16.07.2012, 21:25
Интересующийся
Отправить личное сообщение для deputat333 Посмотреть профиль Найти все сообщения от deputat333
 
Регистрация: 16.07.2012
Сообщений: 10

Не получается setTimeout
Прошу помощи со следующей задачей. Есть горизонтальное меню. Я не хочу чтобы при случайном попадании курсора в область кнопки (либо меню в целом) появлялся дочерний элемент элемент с display:none. Появление элемента реализовано через fadeIn, исчезание fadeOut.
Как сделать таймаут с jquery, чтобы fadeIn и fadeOut срабатывали только если курсор ПРОБУДЕТ заданное время в области кнопки или вне области дочернего элемента соответственно?
Вот код:
$(document).ready(function(){
	$("#mmenu1").mouseenter(function(){
		$("#droptab1").fadeIn(150);
		$("#fon").fadeIn(10);
	}).mouseleave(function(){
		$("#droptab1").fadeOut(150);
		$("#fon").fadeOut(10);
		
	})
});
Ответить с цитированием
  #2 (permalink)  
Старый 16.07.2012, 21:41
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

$(document).ready(function(){
var MinTime=1000;

function TimeShoWYes () {
          if(!$("#mmenu1").hasClass('Active')){
           $("#mmenu1").addClass('Active')
	$("#droptab1").fadeIn(150);
	$("#fon").fadeIn(10);
}}
function TimeHideYes () {
           if($("#mmenu1").hasClass('Active')){
           $("#mmenu1").removeClass('Active')
	$("#droptab1").fadeOut(150);
	$("#fon").fadeOut(10);
}}


         $("#mmenu1").mouseenter(function(){
           setTimeout(function() {TimeShoWYes()},MinTime)

	}).mouseleave(function(){
           setTimeout(function() {TimeHideYes()},MinTime)
	})
});

Последний раз редактировалось Deff, 16.07.2012 в 22:35.
Ответить с цитированием
  #3 (permalink)  
Старый 16.07.2012, 21:49
Интересующийся
Отправить личное сообщение для deputat333 Посмотреть профиль Найти все сообщения от deputat333
 
Регистрация: 16.07.2012
Сообщений: 10

Спасибо огромное!
Ответить с цитированием
  #4 (permalink)  
Старый 16.07.2012, 22:21
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

Поправил
Ответить с цитированием
  #5 (permalink)  
Старый 24.07.2012, 01:02
Интересующийся
Отправить личное сообщение для deputat333 Посмотреть профиль Найти все сообщения от deputat333
 
Регистрация: 16.07.2012
Сообщений: 10

Попутный вопрос - я решил всю функцию запихнуть в одну, т.к. вкладок меню 7 шт.
Но тут проблема с таймаутом - он один и тот же для всех.
Есть какое-то решение этого вопроса или 7 раз прописывать?
Пробовал создавать массив и в качестве параметров передавать цыфры - не работает.
function menuFirstLast(TimerId_01,TimerId_02,droptab,mmenu_fon,mmenu_fon_r,mmenu_fon_l,mmenu){
	var timer=[];
	$(mmenu).mouseenter({
		clearTimeout(timer[TimerId_02]);
		timer[TimerId_01]=setTimeout({
			$(droptab).fadeIn(300);
			$(mmenu_fon).fadeIn(100);
			$(mmenu_fon_r).fadeIn(100);
			$(mmenu_fon_l).fadeIn(100);
		},300)
	}).mouseleave({
		clearTimeout(timer[TimerId_01]);
		timer[TimerId_02]=setTimeout({
			$(droptab).fadeOut(100);
			$(mmenu_fon).fadeOut(100);
			$(mmenu_fon_r).fadeOut(100);
			$(mmenu_fon_l).fadeOut(100);
		},300)
	})
};
Ответить с цитированием
  #6 (permalink)  
Старый 24.07.2012, 01:25
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

deputat333,
При установке Генерить число

var Num_TimerID=[];//Глобальные

Num_TimerID.push(  setTimeout( BB () }  )

function  BB () {
        // Тут что-то;          
}

 $(mmenu).mouseenter({
     for (i=0; i<Num_TimerID.length; i++){
        clearTimeout(Num_TimerID[i]);
     }
//

========================
А в принципе и массив не нужен - достаточно одного TimerId - на все действия
Если запускается иной - все остальные TimerId уже смысла не имеют и должны стираться - занчит одного - за глаза!

Последний раз редактировалось Deff, 24.07.2012 в 01:44.
Ответить с цитированием
  #7 (permalink)  
Старый 24.07.2012, 14:08
Интересующийся
Отправить личное сообщение для deputat333 Посмотреть профиль Найти все сообщения от deputat333
 
Регистрация: 16.07.2012
Сообщений: 10

Не могу разобраться с кодом. Можешь побольше комментариев дописать что куда?
Ответить с цитированием
  #8 (permalink)  
Старый 24.07.2012, 14:18
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

deputat333,
Так - пойдёт ?
var timer=[]; //
function menuFirstLast(TimerId_01,TimerId_02,droptab,mmenu_fon,mmenu_fon_r,mmenu_fon_l,mmenu){
	$(mmenu).mouseenter({
		clearTimeout(timer[TimerId_02]);
		timer[TimerId_01]=setTimeout({
			$(droptab).fadeIn(300);
			$(mmenu_fon).fadeIn(100);
			$(mmenu_fon_r).fadeIn(100);
			$(mmenu_fon_l).fadeIn(100);
		},300)
	}).mouseleave({
		clearTimeout(timer[TimerId_01]);
		timer[TimerId_02]=setTimeout({
			$(droptab).fadeOut(100);
			$(mmenu_fon).fadeOut(100);
			$(mmenu_fon_r).fadeOut(100);
			$(mmenu_fon_l).fadeOut(100);
		},300)
	})
};
Ответить с цитированием
  #9 (permalink)  
Старый 24.07.2012, 23:13
Интересующийся
Отправить личное сообщение для deputat333 Посмотреть профиль Найти все сообщения от deputat333
 
Регистрация: 16.07.2012
Сообщений: 10

В том то и дело, что вот так
var timer=[];
function menuFirstLast(TimerId_01,TimerId_02,droptab,mmenu_fon,mmenu_fon_r,mmenu_fon_l,mmenu){
	$(mmenu).mouseenter({
		clearTimeout(timer[TimerId_02]);
		timer[TimerId_01]=setTimeout({
			$(droptab).fadeIn(300);
			$(mmenu_fon).fadeIn(100);
			$(mmenu_fon_r).fadeIn(100);
			$(mmenu_fon_l).fadeIn(100);
		},300)
	}).mouseleave({
		clearTimeout(timer[TimerId_01]);
		timer[TimerId_02]=setTimeout({
			$(droptab).fadeOut(100);
			$(mmenu_fon).fadeOut(100);
			$(mmenu_fon_r).fadeOut(100);
			$(mmenu_fon_l).fadeOut(100);
		},300)
	})
};
$(document).ready(function(){
	menuFirstLast(1,2,'#droptab1','#mmenu1_fon','#mmenu1_fon_r','#mmenu1_fon_l','#mmenu1');
});

не работает. Вот что пишет firebug:
Изображения:
Тип файла: jpg screen.jpg (120.8 Кб, 3 просмотров)
Ответить с цитированием
  #10 (permalink)  
Старый 24.07.2012, 23:19
без статуса
Отправить личное сообщение для Deff Посмотреть профиль Найти все сообщения от Deff
 
Регистрация: 25.05.2012
Сообщений: 8,219

deputat333,
Поставьте alertы
var timer=[];
function menuFirstLast(TimerId_01,TimerId_02,droptab,mmenu_fon,mmenu_fon_r,mmenu_fon_l,mmenu){
	$(mmenu).mouseenter({
		alert(typeof(TimerId_02)+'='+TimerId_02)
		clearTimeout(timer[TimerId_02]);
		timer[TimerId_01]=setTimeout({
			$(droptab).fadeIn(300);
			$(mmenu_fon).fadeIn(100);
			$(mmenu_fon_r).fadeIn(100);
			$(mmenu_fon_l).fadeIn(100);
		},300)
	}).mouseleave({
		alert(typeof(TimerId_01)+'='+TimerId_01)
		clearTimeout(timer[TimerId_01]);
		timer[TimerId_02]=setTimeout({
			$(droptab).fadeOut(100);
			$(mmenu_fon).fadeOut(100);
			$(mmenu_fon_r).fadeOut(100);
			$(mmenu_fon_l).fadeOut(100);
		},300)
	})
};
$(document).ready(function(){
	menuFirstLast(1,2,'#droptab1','#mmenu1_fon','#mmenu1_fon_r','#mmenu1_fon_l','#mmenu1');
});
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
не получается зациклить анимацию jquery swess jQuery 7 25.10.2011 13:57
dataTables + jeditable не получается сделать поля редактируемыми alekslkta jQuery 0 01.05.2011 23:53
Передача контекста через setTimeout decadent jQuery 3 10.02.2011 19:01
setTimeout в браузере IE и Opera leha66 Javascript под браузер 2 13.12.2010 13:02
setTimeout и др. Destrifer Общие вопросы Javascript 15 10.02.2009 22:09