Overlay Screen Help

The command will paly the sound file, but the video never plays. Please advise. Is there an option to host the video on Wizebot? Below is the code that I’ve used…

  • $(".screen_div").html("<video width=‘100%’ autoplay=‘1’ onended=‘window.notificationEnded()’
  • style=‘position: absolute; bottom: 0; right: 0’><source src=‘https://youtu.be/kSG4Z-xnqAc
  • type=‘video/webm’>");"

You cannot set a youtu.be link as a <video> tag, you gotta do that with the provided <iframe> tag when you click Share > Embed. If you want to use the <video> tag, you gotta download the video first and play it on the overlay from your PC. This also greatly reduces lag and makes sure your overlay is actually visible for as long as the video is playing, because there’s way less lag.

So: Use a YouTube downloader, download the video and then you can use the video tag like you did. Or use YouTube’s iframe code.

Here’s an example code I use to show stuff in the overlay screen with a iframe tag:

setTimeout(function() {
    $('.screen_div').fadeOut('fast', function() {
         $('.screen_div').remove();
         setRefresh();
     });
}, 9200);

$('.screen_div').css({'width' : '100vw', 'height' : '100vh', 'display' : 'flex','justify-content' : 'center', 'align-content' : 'center', 'align-items' : 'center'}).html('<iframe width="1920" height="1080" src="/lvfbGCuM06.mp4" title="" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>');

This topic was automatically closed 5 days after the last reply. New replies are no longer allowed.