Как простои быстро создать анимацию движения?

[popov654]

Собственно вопрос в топике. Большая просьба не предлагать по возможности использовать всякие штуки вроде JQuery и ей подобных, я всё-таки учусь и хочу чтобы код был по максимуму самописный. Если конечно это возможно.

Анимировать мне нужно некую панельку сверху, этакую информационную вкладку. Я хотел бы, чтобы при наведении мыши на нужный угол экрана она плавно выезжала, а при отведении указателя плавно сворачивалась с некоторой задержкой. И чтобы всё было гладко, без рывков, и не угрожало сильно производительности

Вот адрес где можно посмотреть что необходимо. Панелька уже есть, теперь б анимацию только добавить

http://popov654.pp.ru/parser3/main.html

В нижнем фрейме нажмите на кнопку "Анализ", всё появится само)

[Sweet]

Основы программной анимации на JavaScript

[popov654]

Спасибо)
Я уже сделал анимацию, прочитав другую статью на эту тему, чуть попроще) Но я обязательно почитаю потом

Анимация у меня вроде как получилась, мне даже удалось решить три главных задачи: обеспечить скрытие начиная с произвольного места (точнее с того места, где вкладка остановила своё движение), выезд с произвольного места (аналогично), и третье - это ликвидация некого странного глюка, из-за которого вкладка начинала вдруг резко уходить назад (похоже, что моя див-подложка на которую я повесил обработчики мыши отчего-то перемещалась вместе с самой панелькой). Третью проблему я решил, вбив костыли, определяющие абсолютную координату указателя по высоте.

И всё бы ничего... Да вот только моя анимация получилась без преувеличения сказать уж очень фирменной, ибо работает она только в IE. С одной стороны, повод гордиться. С другой - а как же остальные пользователи? У них панель вообще никуда не уезжает! Надо либо решить эту проблему, либо придётся для других браузеров мутить что-нибудь другое - например, затухание в полупрозрачность. Через фильтры или jQuery. Работы много, но возможно оно даже того соит.

И всё-таки мне интересно, почему в Mozilla и Opera не заработало

P.S. После всех манипуляций консоль ошибок в Mozilla ничего не выдала. Значит, код корректный. В чём же проблема? Может, им не дано элементу с position: fixed назначить отрицательные координаты?
А ещё говорят IE стандартам не соответствует

[popov654]

А, сорри, кажется знаю в чём дело. Похоже, было непозволительной вольностью опустить постфикс 'px' при изменении свойства top, а IE просто мне это простил.

Добвлено через 2 минуты:
Да, так оно и оказалось. Однако даже когда я это исправил, панель не желает появляться обратно в Mozilla (в Опере всё ОК!). Ошибок в консоли JS нет. Подозреваю, что в Mozilla что-то происходит не так с моей подложкой, на которую повешено onMouseOver. То есть она и впрямь не расположена там, где должна быть (хотя для неё отдельно прописаны все CSS атрибуты, дублирующие атрибуты панельки, за исключением z-index, который, понятное дело, другой). Как лечить?..

[popov654]

Заменил onMouseEnter на onMouseOver - помогло. Но перестало всё работать в IE. Пришлось определять браузер в функции инициализации, и в случае Mozilla и ей подобных (на ядре Gecko) вызывать

document.getElementById('wrapper').addEventListener("mouseover" , showTab, true);

Проблема решена полностью.

P.S. В IE всё вдруг снова отвалилось, но вышеприведённый код на сей раз не при чём (если его убрать ничего не меняется). Пошёл создавать новую тему