Fixed positioned elements disappear on page unload

Question

I have a fixed top navigation bar that stays on top of everything while the contents of the page are being scrolled. I noticed that in Chrome for iOS and Safari standalone mode, the fixed bar disappears on page unload before any of the other elements. How to make all the elements, regardless of the positioning, to disappear at the same time?

Demo: http://kodu.ut.ee/~b04866/demo/demo.html Load the page in Chrome for iOS, repeatedly click refresh. Observe how the fixed div vanishes first, then the rest of the content, and finally the page is being redrawn.

Answer 1

Fixed elements are lifted to a composited layer and there is a corresponding bug on page unload.

From http://newscentral.exsees.com/item/528d72c6d22fab46e4eb18e5cb8fece0-0d5a1eca143f58f995dc015e265514cb:

"[...] composited layers upon document unload are destroyed much faster than elements that are not [...] This has been confirmed by a WebKit engineer to be a bug."

HOPE:

With iOS 8 a new faster web view component was introduced: WKWebView. Safari use it. The problem went away when using Safari :) I don't know if Chrome is affected under iOS 8.

I compare common UIWebView and new WKWebView under iOS 8. Apps using UIWebView to display html/web content are still affected with the problem :(