Video poster does not display on iPhone/iPad

JW Player — Apr 04, 2014 09:15AM EDT

---

I'm using version 5.3 of the JW Player. When viewing the HTML5 player on the iPhone or Ipad the video posters do not display, the area is black with the video icon. The video does play though without any issues. Scroll down to the bottom video on this page and view it on the iPhone/iPad to see what I mean: http://www.ghostpool.com/dev/1/shortcodes/video-shortcodes

I've tried removing the source tags and adding the video URL directly to the video tag. I've also tried different image URLs in case TimThumb was causing an issue. In both cases the problem still occurs. This is the code I'm using:

bc.. <video id="video-'.$video_name.'" width="'.$width.'" height="'.$height.'" poster="'.get_bloginfo('template_directory') .'/lib/scripts/timthumb.php?src='.$image.'&h='.$height.'&w='.$width.'&zc=1" controls="controls">

<source src="'.$html5_1.'" type=\'video/mp4; codecs="avc1.42E01E, mp4a.40.2"\' />
<source src="'.$html5_1.'" type="video/webm" type=\'video/webm; codecs="vp8, vorbis"\' />
<source src="'.$html5_2.'" type="video/ogg" source src="'.$ogg.'" type=\'video/ogg; codecs="theora, vorbis"\' />

</video>

<script>
jwplayer("video-'.$video_name.'").setup({
file: "'.$url.'",
image: "'.get_bloginfo('template_directory') .'/lib/scripts/timthumb.php?src='.$image.'&h='.$height.'&w='.$width.'&zc=1",
icons: "'.$icons.'",
autostart: "'.$autostart.'",
stretching: "'.$stretching.'",
controlbar: "'.$controlbar.'",
skin: "'.$skin.'",
screencolor: "white",
height: '.$height.',
width: '.$width.',
players: [';
if($priority == "html5") {
$out .= '{type: "html5"}, {type: "flash", src: "'.get_bloginfo("template_directory").'/lib/scripts/mediaplayer/player.swf"}';
} elseif($priority == "flash") {
$out .= '{type: "flash", src: "'.get_bloginfo("template_directory").'/lib/scripts/mediaplayer/player.swf"}, { type: "html5" },';
}
$out .= ']
});
</script>';