Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 02.10.2019, 22:02
Аспирант
Отправить личное сообщение для mazahaler Посмотреть профиль Найти все сообщения от mazahaler
 
Регистрация: 20.11.2017
Сообщений: 72

Jquery. Проблема с Hover/Unhover
Здравствуйте, у меня есть необходимость делать видимым/скрывать определенный блок при наведении/отведении курсора мыши с ссылки(тег a).
Проблема вот в чем: если очень быстро провести курсор через ссылку, то блок появится, но не исчезнет.
Вот код:
$('.desc a').hover(function (e) {
       $('.dynamicBlock').fadeIn();
}, function () {
       $('.dynamicBlock').fadeOut();
});

Кто-нибудь сталкивался с таким? Подскажите как решить.
Ответить с цитированием
  #2 (permalink)  
Старый 02.10.2019, 22:47
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

mazahaler,
$('.dynamicBlock').stop().fade...
Ответить с цитированием
  #3 (permalink)  
Старый 02.10.2019, 23:07
Аспирант
Отправить личное сообщение для mazahaler Посмотреть профиль Найти все сообщения от mazahaler
 
Регистрация: 20.11.2017
Сообщений: 72

рони,
Неа, что-то не помогает.
Ответить с цитированием
  #4 (permalink)  
Старый 03.10.2019, 07:45
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,118

Сообщение от mazahaler
если очень быстро провести курсор через ссылку, то блок появится, но не исчезнет
Я устал водить... Все в итоге исчезает.

<!DOCTYPE html>
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=windows-1251' />
<script src='https://code.jquery.com/jquery-latest.js'></script>
<!--
<script src="https://code.angularjs.org/1.3.9/angular.min.js"></script>
<script src="https://code.angularjs.org/1.3.9/angular-route.js"></script>
-->
<style type='text/css'>
.dynamicBlock {
	display: none;
}
</style>
<script type='text/javascript'>
$(function(){
	$('.desc a').hover(function (e) {
			$('.dynamicBlock').fadeIn();
		}, function () {
		   $('.dynamicBlock').fadeOut();
		}
	);
});
</script>
</head>
<body>
<div class='desc'>
	<a href='#'>Test</a>
	<div class='dynamicBlock'>
		dynamicBlock
	<div>
<div>
</body>
</html>
Ответить с цитированием
  #5 (permalink)  
Старый 03.10.2019, 07:55
Аватар для Белый шум
Профессор
Отправить личное сообщение для Белый шум Посмотреть профиль Найти все сообщения от Белый шум
 
Регистрация: 19.01.2012
Сообщений: 498

Попробуйте так (сам проверить не могу, т.к. у меня тоже всё исчезает и в консоль ничего не попадает - т.е. этот блок кода никогда не выполняется. Возможно от браузера зависит):

<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
<div class="desc"><p>вот это <a href="#">ссылка</a></p></div>
<div class="dynamicBlock" style="display:none;">А это блок</div>
<script>
$('.desc a').hover(function (e) {
       $('.dynamicBlock').finish().fadeIn().queue(function() {
              if(
                $('.desc a:hover').length === 0
                && $('.dynamicBlock').queue().length === 0
                && $('.dynamicBlock').css('display') !== 'none'
              ) {
console.log('аварийное скрытие...');
                     $('.dynamicBlock').fadeOut();
              }
              $(this).dequeue();
       });
}, function () {
       $('.dynamicBlock').finish().fadeOut();
});
</script>
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
jQuery Validation Plugin проблема валидации номера хаудихооо Мобильный JavaScript 1 01.02.2019 20:45
Просмотрела исходик jQuery Откорректируйте где не верно taksebe jQuery 5 23.11.2018 22:42
Проблема с работой скриптов jquery viktorshindarev Общие вопросы Javascript 5 29.12.2017 23:20
Проблема совместного использования Masked Input и jQuery Validation spo jQuery 41 13.04.2016 16:10
проблема с JQUERY rod'ka Я не знаю javascript 1 11.06.2009 17:08