fancybox pro with mp4 videos and autoplay

Your Account / Forums / Easy FancyBox Pro / fancybox pro with mp4 videos and autoplay

  • Author
    • March 14, 2018 at 8:39 pm #11860

      Hello, I have 2 different size mp4 videos, I would like them to open at the right size on a button click and autoplay, and be responsive. Can this be accomplished?

    • March 14, 2018 at 8:39 pm #11862

      Hi Mona, welcome on these forums!

      To have similar media links open in different sizes, you can do the following:
      1. On Settings > Media activate the option to include the jQuery Metadata extension
      2. Then go back to the page where your media links are and add size data to the link class like this example:

      <a href="//ulr.of/my.mp4" class="button fancybox-iframe {width:480,height:360}">watch my movie</a>

      Autoplay is not possible unless supported as a GET parameter by the browser like for example href=”//ulr.of/my.mp4?autoplay=true” but I’d be surprised if at all widely supported…

    • March 14, 2018 at 8:39 pm #11865

      Thank you so much, I did manage to get this far, the only trouble was that it didnt seem responsive. The window height will not change when the window becomes smaller, since its pre-defined by the iframe. Any way to avoid that?

    • March 14, 2018 at 8:39 pm #11950

      Hi Mona, sorry for our late response. We are currently working on a way to keep aspect ratio for video / iframe. We hope to have something soon…

    • March 14, 2018 at 8:39 pm #12020

      Hi Mona, if you update Easy FancyBox to version 1.7 from your site admin, you should get reduced frame size on small screens with respect of original aspect ratio, and resizing on screen rotation.

      Let me know how it works out 🙂

    • March 14, 2018 at 8:39 pm #12021

      I forgot: it is needed to manually add the (new) option {keepRatio:true} to the iframe class metadata.

      This means as per the example from Pharéo above, it would look like this:

      <a class="button fancybox-iframe {keepRatio:true,width:480,height:360}" href="//ulr.of/my.mp4">watch my movie</a>

      In a future version, this will be added as a checkbox option 🙂

  • You must be logged in to reply to this topic.