I'm using Vimeo player's JavaScript API for starting a video when a user clicks on the specific button on the site.

Here's the embedded code:

<iframe id="vimeo-player" src="<?php the_sub_field('slide_video'); ?>?title=0&byline=0&portrait=0" width="1880" height="1058" frameborder="0" ></iframe>

Here's the JavaScript:

    var iframe = document.querySelector('#vimeo-player');
    var player = new Vimeo.Player(iframe);

    $('.slide-area__slides__video svg').click(function(){
        $(this).hide();
        $(this).closest('.item').find('img').hide();
        $(this).siblings('iframe').show();
        player.play();
    });

    player.on('ended', function(data) {
        $('.slide-area__slides__video svg').show();
        $('.slide-area__slides__video iframe').hide();
        $('.slider-area__slides .item img').show();
    });

It works perfectly in Chrome, but in every other browser, it just keeps throwing the error:

The player element passed isn’t a Vimeo embed.

Has anyone encountered this before? It's quite frustrating.

I'm using Vimeo player's JavaScript API for starting a video when a user clicks on the specific button on the site.

Here's the embedded code:

<iframe id="vimeo-player" src="<?php the_sub_field('slide_video'); ?>?title=0&byline=0&portrait=0" width="1880" height="1058" frameborder="0" ></iframe>

Here's the JavaScript:

    var iframe = document.querySelector('#vimeo-player');
    var player = new Vimeo.Player(iframe);

    $('.slide-area__slides__video svg').click(function(){
        $(this).hide();
        $(this).closest('.item').find('img').hide();
        $(this).siblings('iframe').show();
        player.play();
    });

    player.on('ended', function(data) {
        $('.slide-area__slides__video svg').show();
        $('.slide-area__slides__video iframe').hide();
        $('.slider-area__slides .item img').show();
    });

It works perfectly in Chrome, but in every other browser, it just keeps throwing the error:

The player element passed isn’t a Vimeo embed.

Has anyone encountered this before? It's quite frustrating.

• javascript
• jquery

2 Answers 2

Looking at player.js, it seems that the error displays when:

if (element.nodeName === 'IFRAME' && !isVimeoUrl(element.getAttribute('src') || '') {...}

Make sure the_sub_field('slide_video') outputs a valid Vimeo URL.

As stated by NYCjbd in an earlier ment, my problem was related with lazy load. Turning it off for iframes solved it. Many thanks.