How to completely disable YouTube iframe fullscreen? - Youtube Iframe API

user_4262228 0
Viewed 2100

I'm already creating the YouTube player with

playerVars: {
    controls: 0,
    fs: 0,
    disablekb: 1
}

but on double click, it still goes to fullscreen, although it pauses then continues the playback. So if I could disable just the fullscreen part, it would be working fine.

(How) is that possible?

youtube-iframe-api javascript
2 Answers

In the iframe you can put donotallowfullscreen

<iframe src="https://www.youtube.com/embed/test"  donotallowfullscreen>
</iframe>
user_44258490

By creating the iframe by myself, I've managed to resolve the issue. Here is the code:

const createYtPlayer = (videoId, container = inv) => new Promise(resolve => {
    const el = document.createElement('iframe');
    el.frameBorder = 0;
    el.setAttribute('allow', 'accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture');
    el.setAttribute('donotallowfullscreen', '');
    el.src = 'https://www.youtube.com/embed/' + videoId + '?disablekb=1&enablejsapi=1&controls=0&origin=' + encodeURIComponent(window.origin);
    container.appendChild(el);

    const player = new YT.Player(el, {
        height: 200,
        width: 200,
        videoId,
        playerVars: {
            controls: 0,
            fs: 0,
            disablekb: 1
        },
        events: {
            'onReady': () => {
                setBestSoundQuality(player);
                player.setVolume(100);
                resolve(player);
            }
        }
    });
});

})();

OLD ANSWER:

It turned out that its probably a bug. I did a workaround with the help of @Paul Fitzgerald's answer, because that worked.

For some reason, if the allowfullscreen is present in any way, the donotallowfullscreen attribute has no effect (and the allowfullscreen is added automatically).

So I added

const iframe = player.getIframe();
iframe.removeAttribute('allowfullscreen');
iframe.setAttribute('donotallowfullscreen', '');

to the onReady event, and it works.

EDIT: it only seems to work in Firefox.

user_42622280
Related