Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   "Защита от дурака" при многократном наведении курсора мыши на картинку (https://javascript.ru/forum/jquery/25545-zashhita-ot-duraka-pri-mnogokratnom-navedenii-kursora-myshi-na-kartinku.html)

Trish 08.02.2012 20:21

"Защита от дурака" при многократном наведении курсора мыши на картинку
 
Добрый день! Есть проблема: в большом контейнере(<div id="preview">) при наведении курсора мыши на определенную область, заданную координатами, плавно появляется другой контейнер-картинка (div id="expand"). Если курсор мыши убрать из этой области, контейнер "expand" плавно исчезает. Но если подвигать мышкой по этой области много раз - контейнер "expand" начинает столько же раз мигать. Как этого избежать?
Вот код:
Код:

$('#preview').live('mousemove',function(e){
      var x1 = 80; var x2 = 200; var y1 = 80; var y2 = 1000;
        if(((e.pageX>x1)&&(e.pageX<x2))&&((e.pageY>y1)&&(e.pageY<y2))){
            $('#expand').fadeIn(500);                 
        } else $('#expand').fadeOut(500);


bret 09.02.2012 14:23

Попробуйте .stop()

Trish 09.02.2012 15:51

Пробовала .stop(), но тогда эффект fadein/fadeout не работают...

sysya 11.02.2012 16:50

Цитата:

Сообщение от Trish (Сообщение 156368)
Пробовала .stop(), но тогда эффект fadein/fadeout не работают...

тогда можно свой эфект fadein/fadeout сделать с помощью метода animate... так косяков не будет с анимацией

вот так у меня сделано, это с новой jquery 1.7 работает:
$('#menu').on({//в ul#menu
	mouseenter: function(){
		apanel.stop().css({display:'block', height:menu, top:3}).animate({opacity:1}, 300);//появляется элемент вторичного меню при наведении мыши
	},
	mouseleave: function(){
		apanel.stop().animate({opacity:0}, 250, function(){ $(this).css({display:'none'}); });//исчезает
	}
}, 'li.ap');//события мыши сробатывают конкретно на элементе li.ap
как это работает можно глянуть в меню на главной странице моего сайта

sysya 13.02.2012 19:07

есть ещё вариант, проверять, происходит ли анимация элемента... вот мой пост на эту тему: http://javascript.ru/forum/jquery/70...html#post40614


Часовой пояс GMT +3, время: 07:55.