Video subtitle menu not working in iOS6 homescreen webapp

StackOverflow https://stackoverflow.com/questions/13681151

Question

I have a webapp running on iPod Touch and iPad with a video playing page. The video's are transcoded and contain several audio tracks and subtitle tracks (embedded).

Running the webapp from homepage in iOS4.3.3 and iOS5.1.1 runs fine, fullscreen and I am able to select the audio and subtitle tracks.

Now I have an iPod 5th generation with iOS6.0.1. If I run the same webapp on that device from the homescreen, it runs fullscreen but when I press the subtitle button, the menu does not appear on top of the video. When I press the subtitle button (only available when in landscape orientation), then move back to portrait and press the done button, I can see that the adiotrack/subtitle menu was behind the video.

My minimal testcase

<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
    <meta name="apple-mobile-web-app-capable" content="yes" /> <!-- THIS LINE -->
    <title>video test</title>
  </head>
  <body>
    <div id="streampage">
      <video id="videostream" src="main.m4v" controls="controls" preload="none" style="-webkit-transform-style: preserve-3d;"></video>      
    </div>
   </body>
</html>

When I open this in the browser, save it to homescreen and then start it from the homescreen, the audiotrack/subtitle menu is not visible (apparently behind the movie) When I remove the line with comment <!-- THIS LINE -->, open the page in the browser, save it to homescreen and start it from there, I can see the audiotrack/subtitle menu without problems. However, the webapp is not fullscreen anymore.

Anyone knows a workaround to keep the webapp fullscreen when started from homepage -AND- being able to see the audiotrack/subtitle menu?

NOTE: This only fails on iPod. Testing on iPad3 with iOS6.0.1 simply shows the menu.

Was it helpful?

Solution

This problem has been fixed in iOS7.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top