Widgets with video for iBooks

Hype 4 Standard
Hi there! I have done a search on this but cannot find an answer so …

I want to produce a widget that includes several scenes with animation, interactive buttons and videos for iBooks. Is there any way that I can get the video, once clicked, to play fullscreen? The controls do not seem to allow me to drag or expand the video.

Apologies if this is a silly question, I am very new to this … I previously used iAd Producer before it was dropped.

Cheers

I tried to setup a video to go ‘full screen’, but that doesn’t seem to be supported on iBooks.

(I used the code from : https://www.thecssninja.com/javascript/fullscreen ), which does work in browsers.

Here’s my test document: https://www.dropbox.com/s/jbzm76lxdl7lxw9/example-full-screenvideo.zip?dl=0

We can get the Element ID of the video, and play it, then we can go full screen (in browsers) using this code:

var video = document.getElementById("shiba");
video.play();
video.webkitEnterFullScreen();
//video.mozRequestFullScreen();
//video.msRequestFullscreen();

I think your best bet in iBooks is to enlarge the physical size of the video (using a regular timeline) to be the maximum width of your widget. There aren’t any ‘full screen’ buttons on videos, so this feature seems to be disabled by Apple. This is likely to ensure that people don’t get confused where they are when navigating a book. The video controls shown are:

Not sure if this is helpful

https://support.apple.com/kb/ph2796?locale=en_GB

In the Interaction pane of the Widget inspector, do one of the following:

  • Set the widget to play within the book page when readers tap or click it: Click “Plays on page.”To set the widget to play automatically when a reader views the book page, select the “Plays automatically” checkbox.
  • Set the widget to play full-screen when readers tap or click its thumbnail image: Click “Plays full-screen.”
    • Preview the widget: Select the thumbnail image, and click Preview HTML.
    • Change the widget’s thumbnail image: Drag a new image to the thumbnail.

That definitely helps the widget get larger, but you still have the widget ‘X’ close button that would show over a video (if it were set to the full dimensions of the device). Allowing full screen video would be nice.

related: iBooks Author Full Screen Hype Template