Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Событие .hover и .click на одно элементе, конфликт. (https://javascript.ru/forum/misc/49810-sobytie-hover-i-click-na-odno-ehlemente-konflikt.html)

Александр222 29.08.2014 10:15

Событие .hover и .click на одном элементе, конфликт.
 
Здравствуйте.
Подскажите пожалуйста, как правильно написать код, чтобы не было конфликта между событиями .hover и .click на одном элементе.
На десктопной версии используется событие .hover, а на мобильных девайсах .click.

Первая проблема:
Ховер срабатывает по классу которого нет.
Изначально присваивается класс ('as-item-hover') на котором есть событие .hover, и при определенных условиях он снимается.

Вторая проблема:
Событие .click присваивает тот же класс, что и событие .hover .
при клике не присваивается класс, из-за того что срабатывает ховер.

function aboutSteps(){
	var wNowWidth = $(window).width();

	if(wNowWidth >= 940){
		$(".as-item").addClass('as-item-hover');
	}
	else{
		$('.as-item-hover').removeClass('as-item-hover');
	}

	$(".as-item-hover").stop(true,true).hover(
		function(){
			$(this).addClass('as-item-focus');
		},function(){
			$(this).removeClass('as-item-focus');
		}
	);

	$(".as-item").click(function(){
		if(wNowWidth <= 939){
			if($(this).hasClass('as-item-focus')){
				$(this).removeClass('as-item-focus');
			}
			else{
				$('.as-item-focus').removeClass('as-item-focus');
				$(this).addClass('as-item-focus');
			}
		}
		return false
	});
}

Erolast 29.08.2014 10:50

Что за конфликт?

Александр222 29.08.2014 11:11

Ховер срабатывает по классу которого нет.
Изначально присваивается класс ('as-item-hover') на котором есть событие .hover, и при определенных условиях он снимается.
А событие .hover при этом остается, это первая проблема.

Событие .click присваивает тот же класс, что и событие .hover .
Вторая проблема при клике не присваивается класс, из-за того что срабатывает ховер.


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