search

impress / impress.js

It's a presentation framework based on the power of CSS3 transforms and transitions in modern browsers and inspired by the idea behind prezi.com.
http://impress.js.org
MIT License
37.67k stars 6.66k forks source link

Video on iPad #196

Closed djempty closed 12 years ago

djempty commented 12 years ago

Has anybody been able to get video to work on iPad? I have encoded video as mp4 H.264 and everything works fine on my PC in Chrome, but it will not play on iPad. The video appears as a black box and has the "Play" button in the middle... but nothing happens.

Any ideas?

djempty commented 12 years ago

Here's my code. Any help would be appreciated:

<div class="step" data-x="1000" data-y="-1500" style="text-align: center;">
    <q>This is an example of <b>"VIDEO"</b></q>
        <video width="640" height="480" controls="controls" src="video.mp4" >
          Your browser does not support the video tag.
        </video>
    </div>
bartaz commented 12 years ago

First of all I'd check if this particular video works for you on iPad without impress.js.

I don't know how impress.js can relate to video playing, but as video is treated quite special on iOS it can colide with CSS3D transforms (I guess).

I can't really tell cause I don't even have an iPad to test.

djempty commented 12 years ago

Hi,

I got it to work. The issue was with the controls. I ended up using the video.js controls.

Wondering now how I can have the "hint" disappear when the video Play button is pressed.

Any ideas on how I can make the Hint disappear on an event such as this?

Thanks.

mtrinder commented 12 years ago

Hi,

agree with djempty. I have a video that does work on the iPad without impress.js

But with impress.js it doesn't play. I had limited success getting the "controls" to show using this technique,

video { . . . -webkit-transform: translateZ(50px); }

but the video still wouldn't play when tapping the play button.

I am using the video.js controls now too.

Oh and BTW, impress.js rocks!!

Hufnagels commented 11 years ago

Hello Everybody!

I had the same issue, and finaly i put html5 video directly in iframe, and also via php So, i fixed this problem. And there is also a chanche, to use video.js too inside iframe (the idea was: youtube video playing perfectly on ipad in iframe)