Javascript.RU

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

listItems.on('mouseover', '.list-item', hoverOnMouseover);
Уважаемые форумчане,

подскажите пожалуйста как сделать так, чтобы при наведении курсора на DIV, event распространялся на див, а не на элементы внутри его по отдельности.

<ul>
    <li> 
        <div>
            <p><p>
            <button></button>
        </div> 
    </li>
    <li> 
        <div>
            <p><p>
            <button></button>
        </div> 
    </li>
</ul>


listItems.on('mouseover', '.list-item', hoverOnMouseover);
function hoverOnMouseover(ev) {
     var target = $(ev.currentTarget);
     target.css('background', '#CEE6E9');
}


этот код как бы работает, див выкрашивается в нужный цвет, но при передвижении курсора по диву постоянно вызывается указанный в параметрах `on`, элемент list-item. Это не заметно и работает ок, но межает дальнейшей работе.

если непонятно выразился, подскажите скажите как правильно сделать hover на list-item

спасибо!

Последний раз редактировалось tralala, 17.10.2017 в 12:24. Причина: добавить
Ответить с цитированием
  #2 (permalink)  
Старый 17.10.2017, 12:34
Профессор
Отправить личное сообщение для Nexus Посмотреть профиль Найти все сообщения от Nexus
 
Регистрация: 04.12.2012
Сообщений: 3,726

tralala, повешай на дочерние элементы обработчик того же события и отключи всплытие для это события.

$('li').mouseover(function(e){
	$(this).css('background', '#CEE6E9');
}).find('*').mouseover(function(e){
	e.stopPropagation();
});
Ответить с цитированием
  #3 (permalink)  
Старый 17.10.2017, 12:35
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,070

Сообщение от tralala
'mouseover',
mouseenter
Ответить с цитированием
  #4 (permalink)  
Старый 17.10.2017, 12:38
Новичок на форуме
Отправить личное сообщение для tralala Посмотреть профиль Найти все сообщения от tralala
 
Регистрация: 17.10.2017
Сообщений: 2

Огромнющее спасибо
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Не получается поменять высоту div revvo jQuery 4 06.08.2011 13:12
Меню сайта - древовидный список Программер Элементы интерфейса 4 08.01.2011 16:12
меню на CSS не работает в IE scuter Общие вопросы Javascript 3 24.06.2010 23:03
Событие mouseout при наведении мыши на пункт меню WalterScott Events/DOM/Window 2 12.05.2009 22:05
не получается вложить один эффект в другой svip Библиотеки/Тулкиты/Фреймворки 1 30.03.2008 11:07