sistema_lightbox.js

// ============
//  SISTEMA DE LIGHTBOX - SamuraiPetrus
//  Requer JQuery
//=============

//ABRIR LIGHTBOX
// DESKTOP - height: 515px; width: 815px;
// TABLET - height: 485px; width: 615px;
// MOBILE - height: 315px; width: 305px;
function OpenImageLightBox (content) {

    closebutton = '<a class="VideoCloseButton is-animating" href="javascript:CloseImageLightBox();">FECHAR</a>';
    // ESTABELECENDO DIMENSÕES DO LIGHTBOX, LEVANDO EM CONTA O DISPOSITIVO
    if ($(".LightboxImage").hasClass("LightboxImage--mobile")) {

        $(".LightboxImage").css("height", "315px");
        $(".LightboxImage").css("width", "305px");

    }else if ($(".LightboxImage").hasClass("LightboxImage--tablet")) {

        $(".LightboxImage").css("height", "485px");
        $(".LightboxImage").css("width", "615px");

    }else{

        $(".LightboxImage").css("height", "515px");
        $(".LightboxImage").css("width", "815px");

    }

    // APLICANDO MÁSCARA ESCURA AO REDOR DO SITE
    $(".BlackMask").css("display", "block");

    // IMPRIMINDO IFRAME NA TELA
    $(".LightboxImage").html(content + closebutton);

    //IMPEDINDO SCROLL DO USUÁRIO
    $("body").css("overflow", "hidden");

    /* APLICANDO TRANSPARENCIA NA DIV DE EXIBIÇÃO DO LIGHTBOX,
    EVITANDO ASSIM, QUE FIQUEM BORDAS BRANCAS AO REDOR DO IFRAME. */
    $(".LightboxImage").css("background", "transparent");
}

//FECHAR LIGHTBOX DE VÍDEO
function CloseImageLightBox () {

    //REVERTENDO TODOS OS PROCESSOS DE ABERTURA DO LIGHTBOX
    $(".LightboxImage").css("background", "#fff");
    $(".LightboxImage").css("height", "0");
    $(".LightboxImage").css("width", "0");
    $(".BlackMask").css("display", "none");
    $(".LightboxImage").html("");
    $("body").css("overflow", "initial");

}

//AÇÃO DISPARADA AO CLICAR O BOTÃO
function ImageLightBox ( embed ) {
    
    /* ARMAZENANDO IFRAME NA VARIÁVEL CONTENT, 
    ENVIANDO PARA AÇÃO DE ABERTURA DO LIGHTBOX */
    $content = "<iframe width='100%' height='100%' src='"+ embed +"' frameborder='0' allowfullscreen allow='autoplay'></iframe>";
    
    OpenImageLightBox($content);
}

// EVENTO DE FECHAMENTO DO LIGHTBOX AO CLICAR NA MÁSCARA ESCURA
$(".BlackMask").click(function(){
    CloseImageLightBox();
});


// ============
//  FIM DO SISTEMA DE LIGHTBOX
//=============