Div действие onmouse... и ссылки/элементы внутри

Статус
Закрыто для дальнейших ответов.

Romani

Well-Known Member
Регистрация
08.01.2010
Сообщения
462
никак не могу понять, делаю действие onmouseover и onmouseout для дива, внутри дива ссылки, при наведении на блок все отлично, при убратии мыши с блока, тоже все нормально, но если курсор попадет на ссылку внутри этого блока, срабатывает onmouseout, потом опять onmouseover, а этого не надо , как исправить?
 

motek

злой как @
Регистрация
13.04.2010
Сообщения
730
никак не могу понять, делаю действие onmouseover и onmouseout для дива, внутри дива ссылки, при наведении на блок все отлично, при убратии мыши с блока, тоже все нормально, но если курсор попадет на ссылку внутри этого блока, срабатывает onmouseout, потом опять onmouseover, а этого не надо , как исправить?

попробуй onmouseover и onmouseout поменять на mouseenter и mouseleave
--------------------
Код:
$(actBlock).mouseenter( function() {
$(this).highlightFade({speed:fspeed,start:'white',end:'red'});//Ïðè íàâåäåíèè
$(this).stop().animate({height:'500px'},700);
}).mouseleave( function() {

$(this).stop().animate({height:oheight},300);
$(this).highlightFade({speed:fspeed,start:'red',end:'white'});//Åñëè óáðàòü ìûøü
});
 

fantasy4fun

лдж в php
Регистрация
16.08.2009
Сообщения
136
[oftop]гугл не оценит :blush: [/oftop]
 

Romani

Well-Known Member
Регистрация
08.01.2010
Сообщения
462
Почему? Что не так? Это же не аякс, физическо оно есть на странице и доступно для индексации
 

Romani

Well-Known Member
Регистрация
08.01.2010
Сообщения
462
кстати, удалите ссылки примеров плз
 

tigra60

Спасатель
Регистрация
10.12.2009
Сообщения
1 990
В обработчике события mouseover для блока actBlock строку
Код:
$(this).highlightFade({speed:fspeed,start:'white',end:'red'});//При наведении
замените строкой
Код:
$(this).highlightFade({speed:fspeed,start:$(actBlock).css('backgroundColor'),end:'red'});
То есть, стартовым цветом будет не белый, а реальный текущий цвет блока.
Кроме того в стиле для этого блока нужно прямо указать цвет фона:
Код:
	background-color:#fff;
Удачи!
 

tigra60

Спасатель
Регистрация
10.12.2009
Сообщения
1 990
"Ай, как нехорошо получилось! Мы же совсем про Печкина забыли..."
Есть такой метод - hover(in, out), кторый назначает обработчики событий onmouseover (in) и onmouseout (out), игнорируя вложенные элементы!!!
Код:
<script type="text/javascript">
var fspeed = 2000;//скорость смены цвета
$(document).ready(function() {
	var actBlock = ".box";
	var oheight = $(actBlock).css('height');
	$(actBlock).hover( function() {		//При наведении
			$(this).highlightFade({speed:fspeed,start:$(actBlock).css('backgroundColor'),end:'red'});
			$(this).stop().animate({height:'500px'},2000);
		}, function() {					//Если убрать мышь
			$(this).stop().animate({height:oheight},2000);
			$(this).highlightFade({speed:fspeed,start:$(actBlock).css('backgroundColor'),end:'white'});
		});
});
</script>
Очень рекомендую книгу Бер Бибо, Иегуда Кац "jQuery. Подробное руководство по продвинутому JavaScript"
Удачи!
 

Romani

Well-Known Member
Регистрация
08.01.2010
Сообщения
462
tigra60 , не , получение цвета не прокатит, ибо этот плюг только такую запись 'aqua': return [0,255,255]; , или у тебя таки получилось?
А вот про hover очень спасибо =)
 

tigra60

Спасатель
Регистрация
10.12.2009
Сообщения
1 990
Таки получилось, можешь сам попробовать. Плюг принимает цвет в виде #ff0000. Только без метода hover при попадании мыши на ссылку процесс развертывания блока и смены цвета приостанавливается. Прикольно, но неправильно. И еще, старт смены цвета ДОЛЖЕН быть от текущего, иначе при проведении мыши через блок, он резко становится красным и плавно белеет. Это хорошо заметно, если поставить большое время преобразования (см. мой пример)
Удачи!
 

Romani

Well-Known Member
Регистрация
08.01.2010
Сообщения
462
А вообще, что предпочтительнее использовать, и в чем примущества, hover или mouseenter
 

tigra60

Спасатель
Регистрация
10.12.2009
Сообщения
1 990
Не совсем понял, что имеется в виду под именем mouseenter.
hover специально предназначен как раз для подобных случаев, типа выпадающего меню.
 

Romani

Well-Known Member
Регистрация
08.01.2010
Сообщения
462
ну вот жешь, и тоже работает))
попробуй onmouseover и onmouseout поменять на mouseenter и mouseleave
--------------------
$(actBlock).mouseenter( function() {
$(this).highlightFade({speed:fspeed,start:'white',end:'red'});//Ïðè íàâåäåíèè
$(this).stop().animate({height:'500px'},700);
}).mouseleave( function() {

$(this).stop().animate({height:eek:height},300);
$(this).highlightFade({speed:fspeed,start:'red',end:'white'});//Åñëè óáðàòü ìûøü
});
 

Romani

Well-Known Member
Регистрация
08.01.2010
Сообщения
462
вона че вышло, наведите на меню в колоне http://repetitor.us/
 

tigra60

Спасатель
Регистрация
10.12.2009
Сообщения
1 990
Что-то не очень... :blink:
 

Romani

Well-Known Member
Регистрация
08.01.2010
Сообщения
462
А что именно?
 

motek

злой как @
Регистрация
13.04.2010
Сообщения
730
А вообще, что предпочтительнее использовать, и в чем примущества, hover или mouseenter

mouseenter влияет именно на выбранный элемент (в твоём случаи данный див),игнорируя всё то,что находится внутри этого дива...
 

tigra60

Спасатель
Регистрация
10.12.2009
Сообщения
1 990
Страница неприятно прыгает. Может быть, списки сделать position:absolute, чтобы контент не опускался?
И низ списков какой-то отрубленный...

Motek! Можно подробнее про muoseenter() и mouseleave()?
 

Romani

Well-Known Member
Регистрация
08.01.2010
Сообщения
462
Ну да автоскролл поставил... неужто списки контент двигают? :blink: какой браузер?
 

tigra60

Спасатель
Регистрация
10.12.2009
Сообщения
1 990
Опера 10.51
Аналогично FF-3.6.3, IE-8 и Хром
 

Romani

Well-Known Member
Регистрация
08.01.2010
Сообщения
462
хм у меня вроде норм, можно скрин если не затруднит )))
 
Статус
Закрыто для дальнейших ответов.
Верх Низ