Firefox backgroundPosition changes

[wayavo]

Hello All,

I thought it made sense to ask the question before trying to reinvent the wheel. Here is the problem

I am trying to create a scrolling image effect in a div with a fixed height and default width - i.e. width of its parent - and an imge that is taller than the height of the div. The scrolling is being done by changing the backgroundPosition property for the div in question. The code goes something like this

var e = document.getElementById('mydiv');
e.style.backgroundPosition = 'xx yy';

When I have scrolled through the whole height of my image I reverse direction and scroll back again. The effect is controlled via a setInterval with a period of 50ms.

This works perfecty - in IE6, IE7, Safari for Windows and in Google Chrome. However, in Firefox 2 & 3 as well as in Opera 9.1+ it does nothing - i.e. no scrolling.

I have done some searches for this but found nothing definitive. Sounds like Firefox does things differently but I am not sure how.

I am pretty sure someone out there has run into the problem and knows the solution. I would be most grateful for any pointers.