Scrolling is tough... break this into steps. The first step is to write a "scrollDetector", a function that will report the positions, horizontal and vertical, that a user has scrolled.
IE and Moz browsers both store this value, but they use different JavaScript properties (the underlying DOM is different).
Once you can store the pixel values of the scroll, you can use them to position your image (or better yet, the <div> which contains your image).
For IE, use:
document.body.scrollTop
which is the number of pixels FROM the top the user has scrolled. How far right have they scrolled?
document.body.scrollLeft
if the scrollbars don't exist on a particular page, the value returned will be zero.
Moz/Netscape/FireFox browsers use "window.pageYOffset" and "window.pageXOffset".
So you have to write 1) browser detection code and then 2) a function that will report pixels scrolled.
The next problem is, how/when do you call this function? Browsers may or may not have a "scroll" event, which may or may not fire on all elements, or may or may not fire if the scroll was done with the mousewheel vs. keyboard, etc. It's nasty.
So, I would use the setInterval() function. Call your scroll detector every so many milliseconds. Note the pixels scrolled, and use them to adjust your image position.
Lastly, load your setInterval() function in the body onload event.
It's a lot to put together, but it's straightforward coding.
Holler if you need more help.
Unsolved 
Offline 
