jQuery: abilitare le finestre modali di Fancybox sui video inseriti tramite iframe

Possiamo abilitare le finestre modali del plugin jQuery Fancybox anche sui video incorporati tramite iframe.

La soluzione รจ la seguente:


$( "iframe[src*='vimeo.com'" ).each(function() {
    var $video = $( this );
    var src = $video.attr( "src" );
    var parts = src.split( "?" );
    var url = parts[0].replace( "https://player.vimeo.com/video/", "https://vimeo.com/" );

    $video.parent().css( "position", "relative" );
    $video.before( '<a data-ratio="2" href="' + url + '"></a>' );
    $video.prev().css({
        display: "block",
        height: "100%",
        width: "100%",
        position: "absolute",
        "z-index": 1000000
    }).fancybox();
});

Ora il link che lancia la finestra modale di Fancybox si sovrappone all'elemento iframe impedendo l'azione predefinita sul video.