WordPress.org

Forums

HTML5 Videos
[resolved] iPAD and android browser support (13 posts)

  1. jkershner
    Member
    Posted 2 years ago #

    I am able to display videos in standard browsers fine however the native Android and iOS browsers don't work. This is supposed to be HTML5 compliant right? I am using MP4 encoded videos and I can see the videos if I use firefox on android but not the android native browser.

    Thanks to everyone in advance, aside from this issue I am very happy with this plugin!

    -=- Joel -=-

    http://wordpress.org/extend/plugins/html5-videos/

  2. powercat74
    Member
    Plugin Author

    Posted 2 years ago #

    Hey Joel,

    Sorry about the difficulty you are experiencing. This plugin relies on the VideoJs.com javascript library to serve the appropriate video files to the browser. If you visit that page on your devices, are you able to view their example video?

    Also, do you have a link that you could post so we can troubleshoot if the plugin is rendering the correct code?

    Thanks!

    Dustin

  3. jkershner
    Member
    Posted 2 years ago #

    http://teachers.olatheschools.com/jkershnerec/
    Thank you for your prompt response!

    I saw one issue on ipads.
    http://stackoverflow.com/questions/13498408/how-to-make-popcorn-js-work-with-video-js-on-ipad

    It was something to do with video.js stealing touch events.

    I also saw this one dealing with video.js not loading correctly.
    http://stackoverflow.com/questions/11241836/handbrake-encoded-mp4-wont-play-on-ipad-via-videojs

    I don't have an IPAD to test with (was reported by one of my users).
    I tested this on android and it works but on my site it gives an error that this video cannot be played.

    Any suggestions?

  4. powercat74
    Member
    Plugin Author

    Posted 2 years ago #

    Joel,

    I don't have time to troubleshoot today, but I've got an iPad that I'll test on. I did confirm that your site does not work on my iPhone. I noticed that there's a custom.js file that is getting a 404 error, so if that's important, you might check on that.

    By the way, we are just up the road from you - downtown KC. Maybe you could stop by our offices sometime?

    1815 Central St, Ste B
    Kansas City, MO 64108

    I'll let you know as soon as I can get on this.

    Dustin

  5. jkershner
    Member
    Posted 2 years ago #

    The custom.js was a leftover from development. I just removed it from the template. I also disabled all of my other plugins on this site and I also switched to the generic wordpress 2011 theme. Any possibility that it conflicts with jquery?

    So far after all of that I'm still getting an error on Android.
    could it be the media. h.264 encoded mp4?

    I tried posting an ogg vorbis video and still had issues although the player worked on the pc it didnt display in android browser. Firefox for android works sort of.

    hmm.. Puzzling...

  6. powercat74
    Member
    Plugin Author

    Posted 2 years ago #

    Joel,

    If you create a static HTML page, and use the VideoJS javascript library, are you able to see the videos?

    Use this code in the head:

    <link href="http://vjs.zencdn.net/c/video-js.css" rel="stylesheet">
    <script src="http://vjs.zencdn.net/c/video.js"></script>

    And put this in the body:

    <video id="my_video_1" class="video-js vjs-default-skin" controls
    preload="auto" width="640" height="264" poster="my_video_poster.png"
    data-setup="{}">
    <source src="my_video.mp4" type='video/mp4'>
    <source src="my_video.webm" type='video/webm'>
    </video>

    Replace the video sources with your videos. If you can see them in the browser, then the video files are fine, and it has something to do with the code that is output from the plugin. If you can't see them, then I would suspect the files.

    Dustin

  7. jkershner
    Member
    Posted 2 years ago #

    I re-converted the video using Miro Video converter into WEBMSD (webm), MP4 and OGG Vorbis.

    Tested using your code:
    IE8 - doesn't even load (but works on wordpress site?)
    Firefox - works but doesn't like webm
    Chrome - works
    chrome for android os (native browser)- blank area on video window for webm and ogg - gives error on mp4s
    apple safari for ios (native browser)- works for mp4, havent tested webm and ogg by themselves yet.

  8. jkershner
    Member
    Posted 2 years ago #

    I re-converted the video using Miro Video converter into WEBMSD (webm), MP4 and OGG Vorbis.

    Tested using your code:
    IE8 - doesn't even load (but works on wordpress site?)
    Firefox - works but doesn't like webm
    Chrome - works
    chrome for android os (native browser)- blank area on video window for webm and ogg - gives error on mp4s
    apple safari for ios (native browser)- works for mp4

  9. jkershner
    Member
    Posted 2 years ago #

    hmm .. works on android "ice cream sandwich" on motorola xoom.

    Well probably a bug with the phone I was testing.

    I guess this resolves the mystery.. Thanks for your time and patience!

    I guess the issue I had before on IOS was caused by a weird codec issue or a bad encode.

  10. powercat74
    Member
    Plugin Author

    Posted 2 years ago #

    Cool. Glad you got it resolved.

    Look us up sometime!

    Dustin

  11. jkershner
    Member
    Posted 2 years ago #

    Hmmm..
    Now its working on android but not loading on Apple iOS.

    The video works in Apple IOS using the html code you gave me though..

    weird...

  12. jkershner
    Member
    Posted 2 years ago #

    Well after testing on a different site using a direct download and it worked. So I think your off the hook. Thanks again for all of your help!

  13. jkershner
    Member
    Posted 2 years ago #

    Drop by CCCKC on a Thursday night some time.
    c3kc.org

Topic Closed

This topic has been closed to new replies.

About this Plugin

  • HTML5 Videos
  • Frequently Asked Questions
  • Support Threads
  • Reviews

About this Topic