window.scrollto javascript call to uiwebview misbehaving

Question

i have several uiwebviews with a considerable amount of text. when making a window.scrollto (as well as a window.scroll) javascript call to the webviews, they scroll to an incorrect location. e.g. i want to scroll to 12000 but the webview will scroll to 10149 every time instead. while another one will scroll to 10250. yet another one, which i want to scroll to 22000 or so will scroll to 20230 every time instead.

this only happens on the device and not in the simulator.

i am making the call in webViewDidFinishLoad.

i have tried making the call multiple times with no better results. it seems that whatever value the particular webview scrolls to is the farthest it can go when using the scrollto call. there is no problem when giving it a lesser value to scroll to. it's just if you pass that magic number, whatever it is for that webview, it will go no further.

any input would be much appreciated

Answer 1

One reason this might happen is if you're referencing images in your markup without declaring their sizes explicitly. Your images probably haven't finished loading when webViewDidFinishLoad: gets called. The browser lays out the page initially using some assumed image size. Once the image is loaded and the browser can determine its real dimensions, it will reflow the page, potentially causing the total height of the page to increase. If your window.scrollTo call happens before this reflow, you may be attempting to scroll past the end of the document.

If this is what's happening in your case, you can resolve it by declaring the dimensions of your img tags explicitly in your markup or CSS.

If for some reason you can't predict the image dimensions in advance, you can defer your window.scrollTo call until after the images have finished loading by registering a javascript event handler for window.onload, which doesn't fire until all images have finished loading. In the event handler, navigate your window.location.href to some fake URL like "app:imagesFinishedLoading". In your UIWebViewDelegate you can implement webView:shouldStartLoadWithRequest:navigationType: to intercept this navigation, cancel it, and then make your call to window.scrollTo.

Answer 2

so I found that the issue was due to me calling the scrollTo function too early (though I called it in webViewDidFinishLoad which i assumed would only be invoked once the page was fully finished loading, and visually at least it did appear to be). i put in a timer to have the scrollTo method called 300 milliseconds later, and that took care of it.