Javascript.RU

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

Терять hover при нажатие
Здравствуйте.

Есть выпадающий список, при нажатие из предложенных пунктов выдающего списка подгружается асинхронно контент.

Вопрос:

Как как при помощи js потерять hover, что бы список скрылся.

PS. hover установлен через css, ul li:hover ul

Спасибо.

Последний раз редактировалось niko42, 12.05.2014 в 21:21.
Ответить с цитированием
  #2 (permalink)  
Старый 13.05.2014, 09:16
Аспирант
Отправить личное сообщение для Sanda Посмотреть профиль Найти все сообщения от Sanda
 
Регистрация: 12.10.2012
Сообщений: 90

Правильный ответ - никак. Как вариант - раскрывать список не через hover, а через mouseover добавлением класса, а по клику или mouseout удалять этот класс. Там будут свои сложности, но хоть как-то будет работать.
Ответить с цитированием
  #3 (permalink)  
Старый 13.05.2014, 09:18
Профессор
Отправить личное сообщение для krasovsky Посмотреть профиль Найти все сообщения от krasovsky
 
Регистрация: 21.12.2012
Сообщений: 869

попробуй blur(событие)
Ответить с цитированием
  #4 (permalink)  
Старый 13.05.2014, 15:26
Аспирант
Отправить личное сообщение для niko42 Посмотреть профиль Найти все сообщения от niko42
 
Регистрация: 12.07.2012
Сообщений: 81

Сообщение от Sanda Посмотреть сообщение
Правильный ответ - никак. Как вариант - раскрывать список не через hover, а через mouseover добавлением класса, а по клику или mouseout удалять этот класс. Там будут свои сложности, но хоть как-то будет работать.
Лениво писать лишнии два метода... Но придется(((

Сообщение от krasovsky Посмотреть сообщение
попробуй blur(событие)
Блур не так работает как ховер. Не прокатит.
Ответить с цитированием
  #5 (permalink)  
Старый 13.05.2014, 16:04
Аспирант
Отправить личное сообщение для niko42 Посмотреть профиль Найти все сообщения от niko42
 
Регистрация: 12.07.2012
Сообщений: 81

Решение задачи
Вообщем очень лениво написал, работает на ура.
$(document).ready(function(){

	var menu = $('#h_menu').children().children();

	menu.hover(function(){
		$(this).find('ul').show(100);
	}, function(){
		$(this).find('ul').hide(100);
	});


	$(menu.children('a')).click(function(){
		$(this).next().hide();
	});

	menu.find('ul a').click(function(){
		$(this).parent().parent().hide();
	});

});

#h_menu {width: 950px; height: 40px;margin: 15px auto 0 auto;text-align: center;}
#h_menu ul{margin: 0; padding: 0;}
#h_menu ul li{display: inline-block; position:relative; margin: 0;}
#h_menu a{display:inline-block;color: black; font-weight: bold; font-size: 14px; text-decoration: none; margin-left: -4px;padding: 12px 12px;}
#h_menu li:hover a{background-color: white;border-radius: 10px;}
/*Горизантальное верхнее ВСПЛЫВАЮЩИЕ меню с градиентом*/
#h_menu ul li ul{display: none;position: absolute;width: 210px !important;border-bottom: 1px solid #f99100;border-left: 1px solid #f99100;border-right: 1px solid #f99100;border-radius: 0 0 10px 10px;z-index: 999;width: 170px;text-align: left;padding-bottom: 3px;}
#h_menu li ul li{display: block;}
#h_menu ul li ul li a{color: #26272b; margin: 0; font-size: 13px;background-color: rgba(0, 0, 0, 0) !important;display: block;padding: 6px 15px;}
#h_menu li li a:hover{background-color: white !important;border-radius: 5px; color: #6d6e72; }

<div id="h_menu">
	<ul>
		<li><a href=""></a>
			<ul class="e_gradient_o" style="margin-left: 0;">
				<li><a href="/"></a></li>
				<li><a href="/"></a></li>
				<li><a href="/"></a></li>
				<li><a href="/"></a></li>
			</ul>
		</li>
		<li><a href=""></a>
			<ul class="e_gradient_o">
				<li><a href="/"></a></li>
				<li><a href="/"></a></li>
				<li><a href="/"></a></li>
				<li><a href="/"></a></li>
			</ul>
		</li>
		<li><a href=""></a>
			<ul class="e_gradient_o" style="margin-left: -120px;">
				<li><a href="/"></a></li>
				<li><a href="/"></a></li>
				<li><a href="/"></a></li>
				<li><a href="/"></a></li>
			</ul>
		</li>
	</ul>
</div>

Последний раз редактировалось niko42, 13.05.2014 в 16:07.
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Выплывающая подсказка меню при помощи Hover hydetakarai jQuery 2 27.11.2012 00:39
Изменение свойства :hover по клику дива BoB jQuery 6 21.10.2012 13:36
jquery не отрабатывает событие hover out при использовании беспроводной мыши F_Z_14 jQuery 1 09.10.2012 10:32
getAllResponseHeaders() и status имеют смысл только при readyState==4? mister_maxim AJAX и COMET 7 27.03.2011 19:08
Смена картинки (бекграунд дива ) при событии (нажатие клавиш или клавиши и мыши) Monster Events/DOM/Window 5 01.11.2009 01:16