magnificPopup с запросомFullscreen () - PullRequest
Новая
       35

magnificPopup с запросомFullscreen ()

0 голосов
/ 06 декабря 2018

Я пытаюсь открыть полный экран после увеличения всплывающего окна.Я добавил одну кнопку для полноэкранного окна, но я не знаю, почему это не работает.Вот мой код, который я пытаюсь выполнить.Он должен быть таким же, как функциональность F11 для видимого текущего всплывающего окна.

HTML 

<div class="demo_slider_mn clearfix" id="demo_slider_mn">
            <a href="images/other_product_img_1.jpg" title="SEO">
                <img src="images/other_product_img_1.jpg" alt="" title="SEO">
                <div id="close"></div>
            </a>
            <a href="images/other_product_img_1.jpg" title="SEO">
                <img src="images/other_product_img_1.jpg" alt="" title="SEO">
                <div id="close"></div>
            </a>
</div>

JAVASCRIPT: 

$(document).ready(function() {
    $('#demo_slider_mn').magnificPopup({
        delegate: 'a',
        type: 'image',
        tLoading: 'Loading image #%curr%...',
        mainClass: 'mfp-img-mobile',
        gallery: {
            enabled: true,
            navigateByImgClick: true,
            preload: [0,1]
},
        image: {
            tError: '<a href="%url%">The image #%curr%</a> could not be loaded.',
            titleSrc: function(item) {
                return item.el.attr('title') + '<button onclick="openFullscreen();">FULLSCREEN</button>';
            }           
        },
        callbacks: {
            elementParse: function(item) {
            }
        },
        showCloseBtn:true,
    }); 
});
var elem = document.getElementsByClassName("mfp-figure");
function openFullscreen() {
    console.log(elem);
    if (elem.requestFullscreen) {
        elem.requestFullscreen();
    } else if (elem.mozRequestFullScreen) {
        elem.mozRequestFullScreen();
    } else if (elem.webkitRequestFullscreen) {
        elem.webkitRequestFullscreen();
    } else if (elem.msRequestFullscreen) {
        elem.msRequestFullscreen();
    }
}
...