onMouseOut, смена opacity и FireFox - Компьютерный форум OSzone.net

Компьютерный форум OSzone.net (http://forum.oszone.net/index.php)

- Вебмастеру (http://forum.oszone.net/forumdisplay.php?f=22)

- - onMouseOut, смена opacity и FireFox (http://forum.oszone.net/showthread.php?t=52519)

onMouseOut, смена opacity и FireFox

Доброго времени суток господа.
Интересная вещь, однако. Задумался на эффектом ссылки. Эффект со следующей сутью - при наведении (onMouseOver) ссылка (с бэкграундным изображением и бордером) начинает плавно мерцать - менять прозрачность в пределах 30-100%. Создается впечатление флэш-анимации текстовой ссылки.
Реализация работает для IE, но в FF обнаруживается, что при интенсивной смене opacity (10 раз в секунду с |delta| = 15%) не срабатывает событие onMouseOut, т.е. невозможно установить когда прекращать выполнение анимации. Замечено также, что такой багоглюк происходит только когда время задержки указателя на ссылке > ~2 сек. если быстро навести и свести указатель, то FF обрабатывает событийность корректно, во всех иных случаях это не так. Также глюки начинаются когда имеется суммирование тукущей opacity и delta (см. зеленый код). Если суммирование убрать, т.е. opacity=opacity, то глюк не проявляется. приходим к мысли, что при интенсивной смене opacity FF некорректно обрабатывает события сведения указателя с объекта, оно просто не происходит.

Код:

function flash(id)

  {

   var inp = document.getElementById('inp');

   if (browser.isIE)

     {

      var obj = document.getElementById(id);

      if ((obj.filters.alpha.opacity + delta > 100) || (obj.filters.alpha.opacity + delta < 30))

        delta = - delta;

      obj.filters.alpha.opacity += delta;

      inp.value=iCnt+')'+' opacity:'+obj.filters.alpha.opacity+' delta:'+delta/100;

     }

   if (browser.isGecko)

     {

      var obj = document.getElementById(id).style;

      if ((obj.opacity >= 1) || (obj.opacity <= 0.3) )

        delta = - delta;

      obj.opacity = parseFloat(obj.opacity)+delta/100;

      inp.value=iCnt+')'+' opacity:'+parseFloat(obj.opacity)+' delta:'+delta/100;

     }

  }

Еще интересный момент - в документе (см. аттач) имеется вторая ссылка в событиях которой прописан обычный alert. Так в FF, если быстро провести указатель мыши так, что траектория пересекает эту вторую ссылку, то событие onMouseOut будет обработано только после того, как будет сдвинут указатель относительно конечной точки траектории.
P.S. Инпут, расположенный на форме, имеет задачу вывода текущих значений счетчика наведений(+1) и сведений(-1) мыши на/с объект(а), прозрачности объекта и текущего значения дельты прозрачности. Как видно в IE счетчик должен принимать значения 0|1.

В опере7 вообще неработает.
Я так понял, что програмно делать такие эффекты не благодарное дело,
проще сделать гиф или флэш!

Prisoner
напиши в ff. Похоже, имеет смысл :/

slaine
Разумеется, сделать все для всех - трудновато :). На все есть своя причина - opera не поддерживает css3-свойство opacity, а своих фенек по изменению прозрачности у нее нет. Впрочем это не важно, приведенный код - вещь сугубо интимная и дальше IE с FF не пойдет:).
mar
угу... и судя по списку багов связанных с событием onMouseOver(Out) я не буду первым :).

slaine
ну и вообще код всегда менее энергоемок, чем использование gif и flash. Да и вообще решение элегантное :)

Состоялся следующий диалог (сорри, за убогий аглицкий) из трех фраз :)

Цитата:

When some code is frequently changes opacity of some object, onMouseOut of that
object not fires. This trouble arise when mouse pointer stay on object at least
2-3 seconds. I noticed that problem arise when delta (of opacity) is added to
current opacity - some_object.style.opacity (see attach, line 40). If I write
"some_object.style.opacity = some_object.style.opacity" (without adding delta),
when onMouseOut occur correctly, but without necessary functionality. So, the
summary: at intensive opacity changes event onMouseOut not fires.

Reproducible: Always

Steps to Reproduce:
See attach

Цитата:

Seems to work fine for me in the latest nightly trunk build.
Could you please test again with the nightly trunk build?

Цитата:

Yes, you are absolutely right. I'm sorry for disturbance - I didn't know about
the nightly trunk build :(.

Но это как говорится последний писк технологии, стало быть необходимо делать финты ушами или применять эффект только лишь для IE :\.