When I was writting a modal carousel album display, I was having a strange problem with JQuery scrollLeft in Chrome:
I had a div with css set to overflow:hidden and using jquery’s scrollLeft function in order to scroll the thumbnails, everything works, however, if you close the modal (setting the div to display:none), the scrollLeft value change back to 0, so next time I open up the modal again, it won’t remember the scroll position. However firefox and internet explorer doesn’t suffer that.
The way I worked around it was not to use display:none at all, instead use left:-9999 to shift the div out of the page.
I’m encountering the same problem in chrome:
I animate a div’s scrollLeft with jquery. When I set its css property to display:none and re-display it, scrollLeft() infinitly returns 0 event if I try to set it to another value with scrollLeft(X).
Hack solution found:
element.css({‘overflow’: ‘auto’}).scrollLeft();
element.css({‘overflow’: ‘auto’}).scrollLeft();
element.css({‘overflow’: ‘hidden’});
element.css({‘overflow’: ‘hidden’});
Ooupss…
element.css({‘overflow’: ‘auto’}).scrollLeft();
element.css({‘overflow’: ‘hidden’});
is sufficent!
I am having the same issue but couldn’t get your fix to work for me. The element.css({‘overflow’: ‘hidden’}); obviously causes the DIV to stop scrolling. I did see it almost get fixed with re-setting the CSS property to ‘auto’ but I had to attempt to scroll before it reset to zero visually. Any other ideas by chance?
http://jsfiddle.net/santhony7/jtLZ2/
Run
Scroll to the right
Click “Scroll to zero”
Works!
Run
Scroll to the right
Click “Hide it”
Click “Show it”
Click “Scroll to zero”
No worky.
have you tried my work around mentioned in the post?