Javascript.RU

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

Запутался с событиями
Вот собственно то в чем проблема.
http://erro13.technospeech.com/

Все работает нормально пока не наводишь курсор в на поле с title. Как нужно сделать правильно что бы не было этих мерцаний?

Управляющий скрипт такой:
$(document).ready(function() {
	var box = $("<div/>").addClass("box");
	var title = $("<div/>").addClass("title").text("Title");
	for(i = 0; i < 9; i++) {
		var item = $(box).clone();
		item.append($(title).clone());
		$("#content").append(item);
	}
	$(".box").mouseover(function() {
			$(this).find(".title").fadeTo(500, 0.9);
	});
	$(".box").mouseout(function() {
		$(this).find(".title").fadeTo(500, 0.0);
	});
});
Ответить с цитированием
  #2 (permalink)  
Старый 01.11.2011, 13:18
Аватар для trikadin
Модератор
Отправить личное сообщение для trikadin Посмотреть профиль Найти все сообщения от trikadin
 
Регистрация: 27.04.2010
Сообщений: 3,417

А в чём проблема, собственно? По-моему, всё нормально работает.
__________________
Читайте:
Ты любопытный) Всё-таки, ничему в этом мире не помешает хорошая доля юмора)
Как спросить, чтобы вам ответили
Часто Задаваемые Вопросы (FAQ)
Ответить с цитированием
  #3 (permalink)  
Старый 01.11.2011, 13:30
Аспирант
Отправить личное сообщение для Black_Prince Посмотреть профиль Найти все сообщения от Black_Prince
 
Регистрация: 11.07.2011
Сообщений: 64

мерцание происходит потому что вызывается mouseover, потом вы наводите на элемент .title (который находится как я понял внутри элемента .box), т.о. происходит mouseout с элемента .box, но т.к. мышь опять находится на этом элементе после скрытия .title - этот элемент опять отображается (и т.д.)

решение - при mouseout проверьте элемент на который пришла мышь
$(".box").mouseout(function(event) {
	    event = event || window.event
//получаем объект на который ушла мышь
	    var relatedTarget = event.relatedTarget || event.toElement


далее проверяем является ли этот элемент "ребенком" элемента .box - например через parent(). Если да, то не скрываем, если нет - скрываем.
Ответить с цитированием
  #4 (permalink)  
Старый 01.11.2011, 14:37
Аватар для trikadin
Модератор
Отправить личное сообщение для trikadin Посмотреть профиль Найти все сообщения от trikadin
 
Регистрация: 27.04.2010
Сообщений: 3,417

Бред. Так как .title является потомком .box, при движении по нему mouseout для .box происходить не должен. Плюс - элемент не прячется, у него просто нулевая прозрачность. Это означает, что все события будут происходить для .title.
__________________
Читайте:
Ты любопытный) Всё-таки, ничему в этом мире не помешает хорошая доля юмора)
Как спросить, чтобы вам ответили
Часто Задаваемые Вопросы (FAQ)
Ответить с цитированием
  #5 (permalink)  
Старый 01.11.2011, 14:38
Аватар для trikadin
Модератор
Отправить личное сообщение для trikadin Посмотреть профиль Найти все сообщения от trikadin
 
Регистрация: 27.04.2010
Сообщений: 3,417

В этих двух строчках что происходит?

var box = $("<div/>").addClass("box");
var title = $("<div/>").addClass("title").text("Title");
__________________
Читайте:
Ты любопытный) Всё-таки, ничему в этом мире не помешает хорошая доля юмора)
Как спросить, чтобы вам ответили
Часто Задаваемые Вопросы (FAQ)
Ответить с цитированием
  #6 (permalink)  
Старый 01.11.2011, 17:00
Аспирант
Отправить личное сообщение для Black_Prince Посмотреть профиль Найти все сообщения от Black_Prince
 
Регистрация: 11.07.2011
Сообщений: 64

trikadin, бред говорите??? нюню...

я просто сам с таким сталкивался, когда происходило мерцание элементов при использовании mouseover, mouseout. Поэтому рассказываю как я сам с этим боролся.
Ответить с цитированием
  #7 (permalink)  
Старый 02.11.2011, 01:19
Кандидат Javascript-наук
Отправить личное сообщение для MadGest Посмотреть профиль Найти все сообщения от MadGest
 
Регистрация: 12.07.2010
Сообщений: 123

К сожалению желаемый результат не достигнут (((( Жду помощи...
Ответить с цитированием
  #8 (permalink)  
Старый 02.11.2011, 01:34
Аватар для trikadin
Модератор
Отправить личное сообщение для trikadin Посмотреть профиль Найти все сообщения от trikadin
 
Регистрация: 27.04.2010
Сообщений: 3,417

Black_Prince, а обработчик вешали через jquery? Это может быть последствием её использования...

MadGest, попробуйте добавить обработчик стандартными способами.
__________________
Читайте:
Ты любопытный) Всё-таки, ничему в этом мире не помешает хорошая доля юмора)
Как спросить, чтобы вам ответили
Часто Задаваемые Вопросы (FAQ)
Ответить с цитированием
  #9 (permalink)  
Старый 02.11.2011, 01:35
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,109

MadGest,
Попробуйте заменить mouseout на mouseleave
Ответить с цитированием
  #10 (permalink)  
Старый 02.11.2011, 08:20
Кандидат Javascript-наук
Отправить личное сообщение для MadGest Посмотреть профиль Найти все сообщения от MadGest
 
Регистрация: 12.07.2010
Сообщений: 123

Спасибо за mouseleave. Действительно помогло!
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Необходима помощь с событиями heihachi88 Серверные языки и технологии 1 06.08.2011 10:23
Запутался с объектами и массивами OEMOEM Общие вопросы Javascript 6 30.11.2010 10:06
Проблема с событиями после ajax запроса Mirgorod AJAX и COMET 5 12.06.2010 18:24
Немогу поставить условие, запутался nemo Серверные языки и технологии 1 30.01.2010 14:18
совсем уже запутался с тонкостями micscr (X)HTML/CSS 3 23.01.2010 17:32