Модераторы: Sardar, Aliance
  

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> onmouseover 
:(
    Опции темы
iff
Дата 7.3.2012, 14:33 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Администратор
**


Профиль
Группа: Участник
Сообщений: 949
Регистрация: 23.3.2007

Репутация: 3
Всего: 16



Как сделать так, что-бы он не вызывался при наведении на дочернии элементы?


--------------------
DOS... Синей пеленой экран заполнил чистый DOS 
Мышь... Стала вдруг квадратной, потеряла форму мышь... 
Я разбил окно, девяностопятое мастдайное окно, 
И поставил DOS, и тогда увидел: Это счастье, — вот оно.  
PM MAIL WWW   Вверх
502
Дата 7.3.2012, 14:50 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Я всегда прав
*


Профиль
Группа: Участник
Сообщений: 134
Регистрация: 16.7.2011

Репутация: 1
Всего: 4



Цитата(iff @  7.3.2012,  14:33 Найти цитируемый пост)
Как сделать так, что-бы он не вызывался при наведении на дочернии элементы? 

может родительские?
PM MAIL   Вверх
iff
Дата 7.3.2012, 15:07 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Администратор
**


Профиль
Группа: Участник
Сообщений: 949
Регистрация: 23.3.2007

Репутация: 3
Всего: 16



http://www.quizful.net/post/javascript_mouse_events
Цитата

Давайте рассмотрим небольшой пример. Попробуйте поводить курсор мышки поверх элементов с разным фоном. Элемент 1 должен слегка мигать при наведении на него курсором - это срабатывает событие mouseover.
Тем не менее, как Вы видите, это событие срабатывает и при наведении курcора мыши на элемент№2 и даже span.

Этого должно не порисходить.


--------------------
DOS... Синей пеленой экран заполнил чистый DOS 
Мышь... Стала вдруг квадратной, потеряла форму мышь... 
Я разбил окно, девяностопятое мастдайное окно, 
И поставил DOS, и тогда увидел: Это счастье, — вот оно.  
PM MAIL WWW   Вверх
502
Дата 7.3.2012, 15:16 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Я всегда прав
*


Профиль
Группа: Участник
Сообщений: 134
Регистрация: 16.7.2011

Репутация: 1
Всего: 4



Цитата(iff @  7.3.2012,  15:07 Найти цитируемый пост)
Этого должно не порисходить. 

почему это?

Добавлено через 3 минуты и 25 секунд
хотя, да, согласен
PM MAIL   Вверх
Evghenusi
Дата 7.3.2012, 18:45 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


майский жук
**


Профиль
Группа: Участник
Сообщений: 506
Регистрация: 3.8.2006
Где: Молдова, Кишинёв

Репутация: 1
Всего: 15



Цитата(iff @  7.3.2012,  14:33 Найти цитируемый пост)
Как сделать так, что-бы он не вызывался при наведении на дочернии элементы? 
если родительский элемент заранее известен, то к примеру проверяя имя класса, тега ну или айди к примеру.
PM WWW   Вверх
iff
Дата 7.3.2012, 19:11 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Администратор
**


Профиль
Группа: Участник
Сообщений: 949
Регистрация: 23.3.2007

Репутация: 3
Всего: 16



Цитата(Evghenusi @  7.3.2012,  18:45 Найти цитируемый пост)
если родительский элемент заранее известен

Конечно известен (напрмер div), к ниму прикреплено onmouseover. У него есть дочернии например 2 картинки. Так вот при переходи указателя мыши с одной картинки на другую происходит onmouseover, а я хочу что-бы оно происходило только при наведении непосредственно на этот див, а при наведении на его дочернии элементы - нет.


--------------------
DOS... Синей пеленой экран заполнил чистый DOS 
Мышь... Стала вдруг квадратной, потеряла форму мышь... 
Я разбил окно, девяностопятое мастдайное окно, 
И поставил DOS, и тогда увидел: Это счастье, — вот оно.  
PM MAIL WWW   Вверх
Evghenusi
Дата 7.3.2012, 19:53 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


майский жук
**


Профиль
Группа: Участник
Сообщений: 506
Регистрация: 3.8.2006
Где: Молдова, Кишинёв

Репутация: 1
Всего: 15



iff, и что тебя смущает?
почему не проверять имя тега?

Код

e = e || window.event;
t = e.target || e.srcElement;
if(t.tagName == 'DIV')
{
    /*....*/
}
//даже else не нужен

PM WWW   Вверх
Amphiluke
Дата 7.3.2012, 20:00 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


   ☽
***


Профиль
Группа: Завсегдатай
Сообщений: 1253
Регистрация: 26.8.2009

Репутация: 35
Всего: 112



iff, ну так ведь вы сами привели ссылку с ответом на свой вопрос.

Цитата(iff @  7.3.2012,  19:07 Найти цитируемый пост)
http://www.quizful.net/post/javascript_mouse_events

Получаете при помощи relatedTarget/fromElement объект, с которого переместилась мышь. Если объект содержится внутри целевого элемента (проверяется перебором цепи родительских объектов), то значит, указатель движется в пределах этого вашего целевого контейнера, а не переместился на него извне.
PM   Вверх
Evghenusi
Дата 7.3.2012, 20:09 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


майский жук
**


Профиль
Группа: Участник
Сообщений: 506
Регистрация: 3.8.2006
Где: Молдова, Кишинёв

Репутация: 1
Всего: 15



Цитата(Amphiluke @  7.3.2012,  20:00 Найти цитируемый пост)
relatedTarget/fromElement

перед тем как оставил сообщение, тоже читал, но мне кажентся "перебор цепи родительских объектов" будет излишен, либо я что-то упускаю  smile 
PM WWW   Вверх
Amphiluke
Дата 7.3.2012, 20:14 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


   ☽
***


Профиль
Группа: Завсегдатай
Сообщений: 1253
Регистрация: 26.8.2009

Репутация: 35
Всего: 112



Это наиболее универсальный способ (есля я тоже ничего не упускаю). Простая проверка на имя тега работает ровно до тех пор пока не появится дочерний div. Привязка по id элемента, получаемого через target/srcElement возможна не всегда (например, нет доступа к HTML-разметке)
PM   Вверх
Evghenusi
Дата 7.3.2012, 20:20 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


майский жук
**


Профиль
Группа: Участник
Сообщений: 506
Регистрация: 3.8.2006
Где: Молдова, Кишинёв

Репутация: 1
Всего: 15



Цитата(Amphiluke @  7.3.2012,  20:14 Найти цитируемый пост)
пока не появится дочерний div
я ранее сказал, что можно и по имени класса...хотя ладно, упираться рогами не буду  smile .

Amphiluke, пардоньте за глупый вопрос, а как перебирать?  smile , если не затруднит
PM WWW   Вверх
Amphiluke
Дата 7.3.2012, 20:33 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


   ☽
***


Профиль
Группа: Завсегдатай
Сообщений: 1253
Регистрация: 26.8.2009

Репутация: 35
Всего: 112



Ну, к примеру так:
Код

function mouseoverHandler(e) {
    var relEl = e.relatedTarget || e.fromElement;
    while (relEl) {
        if (relEl === this) return;
        relEl = relEl.parentNode;
    }
    document.body.appendChild(document.createTextNode("mouseover!"));
}
window.onload = function() {
    var div = document.getElementById("outer");
    if (div.addEventListener) {
        div.addEventListener("mouseover", mouseoverHandler, false);
    } else {
        div.attachEvent("onmouseover", function() { mouseoverHandler.call(div, event); });
    }
}


Код

<div id="outer" style="padding:30px; background:green; width:300px;">
    <div style="width:40%; background:red;">
        <div style="position:relative; left: 110%; padding:30px; background:yellow;">o</div>
    </div>
</div>


Кстати, этот пример демонстрирует, почему необходимо именно перебирать родительские элементы в цикле, а не просто проверять parentNode
PM   Вверх
iff
Дата 8.3.2012, 15:21 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Администратор
**


Профиль
Группа: Участник
Сообщений: 949
Регистрация: 23.3.2007

Репутация: 3
Всего: 16



спасибо


--------------------
DOS... Синей пеленой экран заполнил чистый DOS 
Мышь... Стала вдруг квадратной, потеряла форму мышь... 
Я разбил окно, девяностопятое мастдайное окно, 
И поставил DOS, и тогда увидел: Это счастье, — вот оно.  
PM MAIL WWW   Вверх
  
Ответ в темуСоздание новой темы Создание опроса
Форум для вопросов, которые имеются в справочниках, но их поиск вызвал затруднения, или для разработчика требуется совет или просьба отыскать ошибку. Напоминаем: 1) чётко формулируйте вопрос, 2) приведите пример того, что уже сделано, 3) укажите явно, нужен работающий пример или подсказка о том, где найти информацию.
 
1 Пользователей читают эту тему (1 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | JavaScript: Общие вопросы | Следующая тема »


 




[ Время генерации скрипта: 0.0797 ]   [ Использовано запросов: 21 ]   [ GZIP включён ]


Реклама на сайте     Информационное спонсорство

 
По вопросам размещения рекламы пишите на vladimir(sobaka)vingrad.ru
Отказ от ответственности     Powered by Invision Power Board(R) 1.3 © 2003  IPS, Inc.