Цитата:
http://mmns.ru/files/moo2/ |
проблема mouseover/mouseout... Допустим есть два div'а - внутренний и внешний. На внешний повешены обработчики mouseover/mouseout. При пересечении границы внутреннего div'а произойдут 2 события mouseout+mouseover. Поэтому jQuery добавила mouseleave и mouseenter. Сейчас посмотрю, что у тебя там по ссылке
|
$("a img").bind("mouseenter", function() { $(this).fadeOut(500); }); $("a img").bind("mouseleave", function() { $(this).fadeIn(500); }); здесь проблема в том, что в результате fadeOut элемент становится скрытым. И тут начинаются приколы. Толком не разобрался, но странно получается, по-разному (в разных браузерах) и не так как требовалось. А надо так (насколько я понял): $("a img").bind("mouseenter", function() { $(this).fadeOut(500).fadeIn(500); }); а, даже не так надо, подумаю |
$("a img").bind("mouseenter", function() { $(this).fadeTo(500, 0.1); }); $("a img").bind("mouseleave", function() { $(this).fadeTo(500, 1); }); ? ;-) в данном случае можно даже mouseOver/mouseOut |
Цитата:
x-yuri cпасибо! Цитата:
fadeTo оказывается... ну уж новичек я :o ф да, тут как раз fadeTo и нужен получается по моей задумке. еще раз спасибо за отклик! |
Я уже сталкивался с этой проблемой.. Решил вот так http://javascript.ru/forum/jquery/24...animaciya.html
|
SashaBorandi, а это уже следующая проблема. О которой автор еще не знает
Я бы так сделал: function onMouseEnterLeave( e ) { if( $.data(this, 'isRunning') ) return; $.data( this, 'isRunning', true ); var el = this; $(this).fadeTo(500, e.data, function() { $.data( el, 'isRunning', false ); }); } $("a img").bind("mouseenter", 0.1, onMouseEnterLeave); $("a img").bind("mouseleave", 1, onMouseEnterLeave); меня только беспокоит не будет ли утечек памяти. Может лучше сделать function onMouseEnterLeave( e ) { if( $.data(this, 'isRunning') ) return; $.data( this, 'isRunning', true ); var id = this.id; $(this).fadeTo(500, e.data, function() { $.data( $('#'+id), 'isRunning', false ); }); } $("a img").bind("mouseenter", 0.1, onMouseEnterLeave); $("a img").bind("mouseleave", 1, onMouseEnterLeave); только id всем пунктам меню надо будет назначить |
Цитата:
сейчас у меня: (http://mmns.ru/files/moo2/) $(document).ready(function(){ $("li a img").bind("mouseenter", function() { $(this).fadeTo(500, 0.1); }); $("li a img").bind("mouseleave", function() { $(this).fadeTo(500, 1); }); }); <style> img {border:0;} ul {width:265px; height:79px} ul li{float:left; display:block} #forum {height:23px; width:76px; background:url(images/forum_over.jpg) top left no-repeat; } #contact {height:23px; width:95px; background:url(images/contact_over.jpg) top left no-repeat;} </style> <ul><li id="forum"><a href="/forum" ><img src="images/forum.jpg" alt="" /></a></li><li id="contact"><a href="/contacts" ><img src="images/contact.jpg" alt="" /></a></li></ul> спасибо. |
а мои варианты - не рабочие? Их два, второй подразумевает назначение всем пунктам меню (img) атрибутов id
|
Цитата:
применяю второй вариант, все тут же _mmns.ru/files/moo2/ наведение работает только с одним меню и без fade out в общем не понял вас немножко где рабочий вариант, что забыл сделать? про id что имеется в виду, если добавляю к картинкам id то не работает в таком случае fadeOut и еще чтобы понять - мы же говорим о зацикливании - то есть если мышкой много раз понаводить по менюшкам то эффект повторится n' раз? спасибо за помощь тк я не понимаю в решении данной проблемы. |
Часовой пояс GMT +3, время: 20:42. |