Is it possible (as it would be in Twine) to shrink youtube videos down to 1x1 pix frames and have them loop to give the effect of background music? I know how to add videos, but I'm not quite sure how to get them to loop, autoplay, and change size. The tutorial isn't very helpful, as I'm copying everything it says, yet it still says the ID parameter isn't valid.

The reason I want to do this, is so I can have a lot of music without capping out the 20mb file limit on the game itself.

I found an alt solution in another question I asked: https://textadventures.co.uk/forum/quest/topic/6x-kw_5rokc0nuwncdd6ja/how-to-host-music-from-another-site

The main problem with doing that is that some browsers (especially on mobile) will automatically mute embedded videos; or will not autostart a video that isn't muted.

I've been able to get it to work on Twine, but I'm currently trying to shift over to Quest for my latest project.
This is the code I currently use in Twine:

//In javascript//

​
$('body').append('<div id="youtubetunes"></div>');
​
var YouTubeTunes = {
​
    play: function(id){
      
        console.log('YouTubeTunes:' + id);
​
        if(this.current != id){
​
            this.current = id;
​
            var container = $('#youtubetunes');
​
            container.empty();
​
            container.append('<div id="contentframe" style="position:absolute; z-index:3; top: 0px; left: 0px;"><iframe width="1" height="1" src="https://www.youtube.com/embed/'+id+'?rel=0&volume=50&autoplay=1&controls=0&showinfo=0&loop=1&playlist='+id+'" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen ></iframe>') ;
​
        } else {
​
            console.log('already playing');
​
        }
​
    },
​
    stop: function(){
​
        $('#youtubetunes').empty();


//In the passage I want music//

<div style="display: none;"><img src="!@#$" onerror="YouTubeTunes.play('TBXcQEu74wI');"/>```