Приветствую всех!

Некоторое время назад я опубликовал пост, в котором рассказывал о плагине для jQuery, позволяющем создать плавающий виджет.

Но, благодаря читателям этого блога, выяснилось, что протестировал я работу плагина не очень хорошо. За это всем ещё раз огромное спасибо! Очень приятно, что кто-то пользуется моим кодом и помогает делать его лучше.

Но вернёмся к плагину. Проблема возникла в широко известном браузере под названием IE6, о котором уже давно хочется забыть … но есть люди, которые им пользуются

Хуже оказалось то, что не удалось найти хорошего решения. Т.е. виджет в IE6 теперь работает, но хуже, чем в остальных браузерах.

Проблема заключается в следующем. IE6 не поддерживает CSS свойство position: fixed. Это свойство указывает, что элемент должен фиксироваться при прокрутке страницы относительно окна браузера.

Существует несколько способов решения этой проблемы. В частности, хочу посоветовать очень хорошую статью Полноценный fixed в MSIE.

Но, все приведённые в ней решения, требуют использования выражений (expression) в CSS свойствах, и, по-с сути, означают динамическую установку свойства top с помощью JS кода.

Недостаток такого решения в том, что при прокрутке элемент начинает мерцать и «дёргаться». Правда, в той статье предложено решение этой проблемы, но оно предполагает использование фонового изображения для тега body. А если плагин, начнет менять эти стили, то возможны проблемы с дизайном страницы. Т.е. вебмастер сам должен решить как использовать этот приём.

Теперь рассмотрим изменения, которые я внёс в плагин.

Как видите, их не много (начинаются со строки 17).

Во время работы, плагин изменяет позиционирование виджета с абсолютного на фиксированное. Это сделано для того, чтобы виджет не «наезжал» на шапку страницы (подробнее в предыдущей статье). Но теперь, перед изменением позиционирования на фиксированное, выполняется проверка версии браузера.

Если мы имеем дело с IE6, то позиционирование остаётся абсолютным, а фиксация виджета осуществляется за счет изменения свойства top. Функция updateElement выполняется в обработчике события scroll, т.о. пересчёт свойства top при прокрутке страницы выполняется постоянно, что и приводит к мерцаниям.

Во всех остальных браузерах используется свойство fixed.

Ссылка на архив с обновлённым плагином.

Решение, как я и говорил, не идеальное, но всё-таки хороший момент в нём есть. Возможно кто-то из пользователей IE6 увидит, что сайты в новых браузерах смотрятся лучше, и решит, что пора что-то менять

Удачи!