JS YouTube Embed swap inconsistent over different iOS versions

So I'm working on a mobile site that has some videos on it. I am using the provided YouTube API for switching between flash and HTML5 on different devices, but I am using custom thumbnails for those for a couple different reasons.

I use some javascript to hide the YouTube iframe until a user clicks on a picture, and then it is supposed to swap out the image for the video onClick, calling the switchItUp method.

        var video = document.getElementById("VideoID");
        var image = document.getElementById("PlaceholderImage");
        video.style.display = "none";

        function switchItUp() {
            var video = document.getElementById("VideoID");
            var image = document.getElementById("PlaceholderImage");
            image.style.display = "none";
            video.style.display = "block";
        }

The YouTube code, as specified by the API, is as follows (and works when on the page alone):

<iframe src="http://www.youtube.com/embed/BaKcl0Qg13o?autoplay=1" width="300" height="190"></iframe>

Here's the fun part.

• This works great in Safari on 4.0.
• In 4.1 the onClick shows the video, but you can't play it.
• In 4.2 the video doesn't show at all, but leaves a giant blank space on the page when the image hides.

It works great on all the desktop browsers, so debugging this is a problem.

Any help is appreciated! TYIA!

EDIT: The player must be on autoplay for the swap to work on 1 click, so it must start out as display:none on the page.

Also, would the container cause this problem? It's currently rendering inside a 开发者_运维问答<span> on the page, that doesn't have display:block set before display:none.

Try to hide the video by positioning it off the screen rather than using display=none. This is a classic work around for this kind of problem.

video.style.position = 'absolute';
video.style.top = '-10000px';
video.style.left = '-10000px';

Then you can 'show' it with

video.style.position = 'static'

Because of the autoplay doesn't work in 4.2 we decided to get rid of the thumbnail swap. There isn't a way to do this that works across all iOS versions. So we are just using some youtube-generated thumbnails.