Clever Geek Handbook

Jquery and vimeo: won't auto start

I have a vimeo video that loads when the user clicks on a div.

<div class="vimeobox" ID="vimeo-ID-goes-here"></div>

Here is my javascript:

$(".vimeobox").click(function() {

        var iframe = "<iframe />";
        var id = $(this).attr('id'); // 
        var url = "http://player.vimeo.com/video/" + id + "?title=0&amp;byline=0&amp;portrait=0&amp;autoplay=1";

        var width = 700;
        var height = 394;
        var frameborder = 0;

         $(iframe, {
            name: 'videoframe',
            id: 'videoframe',
            src: url,
            width: width,
            height: height,
            frameborder: frameborder,
            type: 'text/html',
            allowfullscreen: true,
            webkitAllowFullScreen: true,
            mozallowfullscreen: true
        }).css({'position': 'absolute', 'top': '0', 'left': '0'}).appendTo(this);

        $(this).find('img').fadeOut(function() { $(this).remove();

        });

    });

The vimeo player appears when clicking on the div (remove the preview image) ... but the video doesn't start automatically.

I do not know what's the problem. I am using almost identical code for youtube player (minus url variable) and it starts automatically?

+3


source to share


3 answers


Just change &amp;

in your url to ?

.



+3


source


The other answers here are indeed correct, but if you're having problems autoplaying on mobile, you're out of luck, as the default AutoPlay features as described here DO NOT WORK on mobile (Android / iOS and probably Windows Mobile) with time of writing.



If anyone has figured out the hacks to get autoplay to function, please post.

0


source


You can also do it manually by adding the following parameters to your embed code: loop = 1 autoplay = 1 If you have multiple videos on a specific page, you need to enable this parameter as well: autopause = 0

0


source






More articles:


All Articles