Здравствуйте.
Есть div-ы с именем full_screen, с картинкой в фоне. При прокрутке страницы фон у этих дивов смещается, то есть, создается эффект параллакса.
Всё работает. НО! Очень сильно дергаются, никакой плавности не наблюдается (в Опере и Хроме, в ИЕ и ФФ нормально).
В чем проблема, подскажите пожалуйста
Код:
var elems = document.getElementsByName("full_screen");
function getCoords(elem) { //получаем координаты объекта
var box = elem.getBoundingClientRect();
var body = document.body;
var docElem = document.documentElement;
var scrollTop = window.pageYOffset || docElem.scrollTop || body.scrollTop;
var scrollLeft = window.pageXOffset || docElem.scrollLeft || body.scrollLeft;
var clientTop = docElem.clientTop || body.clientTop || 0;
var clientLeft = docElem.clientLeft || body.clientLeft || 0;
var top = box.top + scrollTop - clientTop;
var left = box.left + scrollLeft - clientLeft;
return { top: Math.round(top), left: Math.round(left) };
}
function bgscroll() { //прокручиваем
pageY = window.pageYOffset || document.documentElement.scrollTop;
clientY = document.documentElement.clientHeight || document.body.clientHeight;
for (i=0; i<elems.length; i++){
elemTop = getCoords(elems[i]).top;
if (elemTop < pageY+clientY && pageY < elemTop+elems[i].offsetHeight) { // если картинка показалась на экране верхним или нижним краем
elems[i].style.backgroundPosition = "center " + Math.floor((pageY-elemTop)*0.6)+"px"; // делаем смещение её фона равным разнице между ее расположением относительно начала документа и прокруткой, умноженное на коэффицент (который и создает эффект паралакса)
}
}
}
window.onscroll = function(){
bgscroll();
}