javascript - Smooth cross-browser diagonal scrolling with jQuery -

depending on vertical scrolling of page move <div> called container horizontally:

scrollelement.scroll(function() {     var offsetleft = scrollelement.scrolltop() / x;     container.css({ left: offsetleft  + 'px' }); }); 

this creates diagonal scrolling effect when user scrolls vertically.

the scrolling barely acceptable in firefox jumpy in google chrome: chrome fails sync movement on x- , y-axis when scroll , therefore first scrolls down , adjusts x-offset. firefox lags when scroll quickly.

is there better way implement "diagonal scrolling"? possible make more smooth?

i want div not scroll far down without correcting x-coordinates every time.

you try animation instead of setting css container offset directly.

scrollelement.scroll(function() {   var offsetleft = scrollelement.scrolltop() / x;    container.stop(true, false); // stop current animation,                                // caused previous scroll event fire.   container.animate({ left: offsetleft  + 'px' }); });