setPlaybackQuality not working YouTube JS API

Question

First video is loaded in 1080p than when I press a button with class="quality" It should change the quality to 720p but it's not working in HTML5 player.

It works on Flash Player but not in HTML5. I'm using JavaScript Player API.

Note: None of these solutions worked for me. YouTube iFrame API "setPlaybackQuality" or "suggestedQuality" not working

function onPlayerReady(event) {
    event.target.playVideo();
    event.target.setPlaybackQuality('hd1080'); //works
}

function onPlayerStateChange(event) {
    if (event.data == YT.PlayerState.PLAYING) {
        $(".quality").click(function() {
            event.target.setPlaybackQuality('hd720'); //doesn't work
        });    
    }
}

The problem is you can not downgrade quality. Once you set to 1080p for ex you can not go back to 720p.

possible duplicate of [YouTube iFrame API "setPlaybackQuality" or "suggestedQuality" not working](http://stackoverflow.com/questions/8802498/youtube-iframe-api-setplaybackquality-or-suggestedquality-not-working) — T.Todua, May 22 '15 at 10:43

score 1 · Accepted Answer · answered Nov 19 '14 at 17:51

I have taken the example from this site YouTube Player API Reference for iframe Embeds. I have manually added one button to change the quality which is working absolutely fine, Here is the working code.

<!DOCTYPE html>
<html>
    <head>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    </head>
    <body>
        <button id="change_quality">Change Quality</button>
        <div id="player"></div>
        <script>
            var tag = document.createElement('script');
            tag.src = "https://www.youtube.com/iframe_api";
            var firstScriptTag = document.getElementsByTagName('script')[0];
            firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
            var player;
            function onYouTubeIframeAPIReady() {
                player = new YT.Player('player', {
                height: '390',
                width: '640',
                videoId: 'M7lc1UVf-VE',
                events: {
                    'onReady': onPlayerReady,
                    'onStateChange': onPlayerStateChange
                }
                });
            }
            function onPlayerReady(event) {
                event.target.playVideo();
                event.target.setPlaybackQuality('360p');
            }
            function onPlayerStateChange(event) {
                if (event.data == YT.PlayerState.PLAYING) {
                    $("#change_quality").click(function() {
                        event.target.setPlaybackQuality('240p');
                    });
                }
            }
        </script>
    </body>
</html>

Initially onPlayerReady the quality is set to 360p. After clicking on Change Quality button the quality is set to 144p.

The problem is you can not downgrade quality. Once you set to 1080p for ex you can not go back to 720p See my updated question or set the values hd1080 and then on #change quality button hd720 @Varun — M1X, Nov 19 '14 at 18:49
@rexhin, In my example I am also downgrading the quality from 360p to 144p. — Varun Chakervarti, Nov 20 '14 at 01:17
Yes but it doesen't seem to be working from 1080p to 720p @Varun — M1X, Nov 20 '14 at 16:08
setPlaybackQuality seems to have stopped working around December 2017, at least for me... Am I the only one? — Frank Einstein, Jan 12 '18 at 09:13
@FrankEinstein Any word on this? I've noticed it's not working for me either. — NullReference, Jan 17 '18 at 23:59
It's even not working on their official documentation of the API's. https://developers.google.com/youtube/youtube_player_demo — Varun Chakervarti, Apr 02 '18 at 14:23

score 0 · Answer 2 · edited Nov 19 '14 at 20:24

0

Try stopping the video, then setting the playback quality, then resuming playback.

function onPlayerStateChange(event) {
    $(".quality").click(function() {
        event.target.stopVideo();
        event.target.setPlaybackQuality('hd720');
        event.target.playVideo();
    });    
}

edited Nov 19 '14 at 20:24

Ben

10,056
5
41
42

answered Nov 19 '14 at 19:40

M1X

4,971
10
61
123

setPlaybackQuality not working YouTube JS API

2 Answers2

Linked