Здравствуйте.
Есть фоновая фиксированная картинка реализованная таким образом:
#all {background:url(images/background.jpg) fixed no-repeat top center;}
Все отлично работает, но есть один большой недостаток: при скролинге, особенно а опере все жутко тормозить. Вопрос - как еще можно зафиксировать фон без глючного background-attachment:fixed. И интересно, зачем вообще этот fixed нужен если так тормозит уже по-умолчанию?
Погуглив, отчасти решил проблему. Нашел один скрипт
http://userscripts.org/scripts/review/54099. Правда он для блоков с position:fixed и при скролинге страницы прячет блок. Т. е проблема довольно распространена даже с небольшими блоками -
http://userscripts.org/scripts/show/54099. Немного изменив код: с g_btnStyle.visibility = "hidden" на g_btnStyle.background-color = "#000", т. е. тупо добавив цвет бэкрагунда и, о чудо, в опере и ff пропали рывки и появилась плавность, хотя общая тормознутость осталась и загрузка ЦП, возможно даже увеличилась. Теперь вопрос, что вообще происходит? Неужели движки оперы и ff(в меньшей степени) так плохо оптимизированы, что гючат от обычной зафиксированной фоновой картинки? Хром отлично отображает в обоих случаях . Если уж без скрипта не обойтись, то прошу помочь добавить каких-нибудь красивостей, вроде затухания картинки, чтоб скрип делал что-нибудь полезное, а не тупо заливал цветом скрытый бэкграунд. Или возможно есть какие приемы, чтобы решить проблему.
У меня была похожая ситуация: БГ на сайте был выполнен одной большой картинкой с плавным градиентом сверху вниз. При скроллинге наблюдались заметные притормозки (ступенчатые скачки). Поменял БГ и скроллинг заработал плавно.
Упрощенная структура сайта:
#all {background:url(images/background.jpg) fixed no-repeat top center; background-color:#fff;}
#content{width: 1200px;margin: 0 auto;}
}
Много контента
Т. е все элементарно просто и без извратов. Но в опре, чтоб ее притормаживает.
http://srcboard.com/034v5a32