Jerky jquery scroll motion in Firefox

Question

I have 2 divs in fixed positions on my page, the idea is that their contents scroll when the page scrolls. However, when using Firefox, when there are many other DOM objects on the page, the movement (especially vertical) is very jerky. Performance is thin in chrome and IE7 / 8. The code is shown below -

If anyone can indicate how this can be optimized or simplified, I would be very grateful!

I bind my window scroll event like this:

$(document).ready(function()
{
   $(window).scroll(scrollMover);
});

If the scroll function is defined as

function scrollMover()
{        
    var offSets = getScrollXY();
    document.getElementByID('divA').scrollLeft = offSets[0];
    document.getElementByID('divB').scrollTop = offSets[1];

}

and

function getScrollXY()
{
var XOffset = 0, YOffset = 0;
if (typeof (window.pageYOffset) == 'number')
{
    //Netscape compliant
    YOffset = window.pageYOffset;
    XOffset = window.pageXOffset;
} else if (document.body && (document.body.scrollLeft || document.body.scrollTop))
{
    //DOM compliant
    YOffset = document.body.scrollTop;
    XOffset = document.body.scrollLeft;
} else if (document.documentElement && (document.documentElement.scrollLeft || document.documentElement.scrollTop))
{
    //IE6 standards compliant mode
    YOffset = document.documentElement.scrollTop;
    XOffset = document.documentElement.scrollLeft;
}
return [XOffset, YOffset];
}

Here's the Live Example , unfortunately, it's a little useless, since there are no scroll bars on the page !;)

: , ! fudgey.

Answer 1

, Firefox div, ! , firefox : . , jQuery , . , divs : absolute. :

 function scrollingDiv() {
  var scrolledY = (document.all ? document.scrollTop : window.pageYOffset);
  var newHeight = Math.floor(scrolledY);
  var totalPageHeight = $(document).height();
  if (newHeight < 150) { newHeight = 150; } //This is if you want the div placed below an element and is the offset found in the css
  else if (newHeight > totalPageHeight) { newHeight = totalPageHeight}
  $("#right-div").css({ 'top' : newHeight + 'px'});
}

: $(window).scroll(function() { scrollingDiv() });

CSS:

#right-div {
z-index: -99; /*set to this so it appears under other elements not necessary */
position: absolute;
top: 150px; /*offset from top*/
right: 0;
width: 300px; /*width of div*/
height: 100%; /*if you want it to fill up the entire page*/
overflow: visible; }

, Firefox.