I'm trying to load on the fly on the iPad/iPhone and notice that I cannot place a div above this. I put the overlay in the html so that it's generated on page load and not added via javascript and the video when its created is absolutely positioned below this element. This works on a PC, I'm wondering if since it was created via js that the iPhone OS is overriding the z-index and forcing to the top?

Also is there a way to override the default "cannot play icon", the one with the slash, and show a loading animation instead? This would solve my issue via another route.

My last option would be to loaded all the video tags via js on page load and have them layered on top of each other for the iPad/iPhone? Since the iPhone OS won't load any video until requested would this work?

I also am having an issue with the iPhone and showing the "poster" attribute that is set on the video tag.