Search code examples
jqueryfancybox

Remove poster attribute from video


I'm loading a video in FancyBox 3 from Slider Revolution.

When the user clicks on the play button image, the video loads in the lightbox but uses the play button as the poster image.

I've tried to remove that poster image but it isn't working.

$('.fancybox').fancybox({

    onInit: function (instance, current) {
        $('.fancybox-video').attr('poster', '');
    },

    // also tried this
    // type: 'ajax',
    // afterShow: function() {
    //     $('.fancybox-video').attr('poster', '');
    // }

});

Solution

  • As always, the answer is found in the documentation:

    $('.fancybox').fancybox({
        video: {
            tpl:
                '<video class="fancybox-video" controls controlsList="nodownload" poster="">' +
                '<source src="{{src}}" type="{{format}}" />' +
                'Sorry, your browser doesn\'t support embedded videos, <a href="{{src}}">download</a> and watch with your favorite video player!' +
                "</video>",
            format: "", // custom video format
            autoStart: true
            }, 
    });