H5P mp4 content display problem in Safari

Submitted by emto on Mon, 12/17/2018 - 22:38
Forums: 
Bugs in content types

Hi there,

being a newbie to H5P, I have created a blended learning course with 67 videos (mp4) which I now plan to embed using H5P on a WordPress site with the WordPress H5P plugin. However, in Safari (and Safari only) I have display problems: The video container is too big, when I start playing the video, the controls are displayed for a split second but then disappear so I can no longer control the video. I am adding two screenshots to explain the problem, and you can also see the live problem here: http://www.towfigh.net/emanuel/de/lehrvideos 

  1. Detailed steps to reproduce the bug (exactly how and when did it happen): see above
  2. Platform and version number. E.g. Drupal, Wordpress, Moodle: WordPress, latest release (5.0.1)
  3. Mobile or Desktop: Desktop
  4. Browser: Chrome, Firefox, Safari etc: Safari 12.0.2
  5. H5P plugin version: 1.11.3
  6. H5P content type and version (if a content type was used), and a sample URL or attached H5P: see above / interactive video / mp4 content
  7. Any browser console errors: none
  8. Any PHP errors: none
  9. Screenshots if it's a visual problem: see attached

Thank you for your assistance!

Best,

Emanuel

Attachments: 
Image icon Screen Shot 2018-12-17 at 22.33.35.png
Image icon Screen Shot 2018-12-17 at 22.33.48.png
BV52's picture

BV52

Wed, 12/19/2018 - 02:15

Hi Emanuel,

I was able to reproduce soemthing similar to what you described above. Although on my end the controls at the bottom does not disappear, instead the container's height expands. I would suggest checking your theme or other plugins that may be causing this. I would also like to ask how are you embedding the H5P content is it through the shortcode or the embed code?

-BV52

emto

Wed, 12/19/2018 - 02:37

Thanks! Any idea where I could look regarding plugin or theme/css. Problem is it all works fine in other browsers… I am using an internal shortcode to embed the video.

BV52's picture

BV52

Wed, 12/19/2018 - 07:02

Hi Emanuel,

You can go to Wordpress' admin page and go to the plugins. You do not have to worry about deactivating plugins in WP since in most cases they can be deactivated/reactivated without any problems.

-BV52

alexlewis

Thu, 06/06/2019 - 07:33

Hi there!

I was just wondering how you managed to fix this? I've encountered the same display issue  for an interactive video on Moodle in Safari only as well (see attached screenshot). Sometimes it loads halfway cut off like Emmanual origianlly showed and other times it loads with the container's height expanded the way BV52 described.

Emmanual, it looks like it's now fine on your wordpress site, did you manage to pinpoint it the issue?

I've noticed if I embed an interactive video from h5p.org rather than one built on Moodle, it works fine. Could the version of H5P be an issue?

Thanks!
Alex

Attachments: 
Image icon H5P-Safari.png
BV52's picture

BV52

Fri, 06/07/2019 - 04:20

Hi Alex,

I can only assume but maybe my suggestion above worked you might want to try it out.

-BV52

alexlewis

Thu, 06/13/2019 - 03:15

Hi BV52,

Thanks very much for getting back to me. I'll talk to my site admins and see if there's anything they can do with plugins/themes/version. The workaround is to use another browser, which is ok for now.

Thanks!
Alex