javascript - 如何避免在小视口(viewport)上打开litebox？

Question

我想避免 litebox在 Android 或 Apple 设备的小视口(viewport)上打开。

这是我尝试过的方法，但没有成功:

$( document ).ajaxComplete( function() {	

    $('.litebox').liteBox({
        callbackBeforeOpen: function() {
            console.log('open');
            var windowsize = $(window).width();
            // test the viewport size to see if it's smaller than 480px
            if (windowsize < 1000) {
                // cancel the lightbox and load the link url
                console.log('close');
                $(this).closeLitebox();
            }
        } 
    });	
		
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://rawgit.com/joemottershaw/litebox/master/assets/js/litebox.js"></script>

<a href="https://www.youtube.com/watch?v=gOLY7bjCTTE" target="_blank" class="litebox">Video</a>

我收到错误...

TypeError: $(...).closeLitebox is not a function

$(this).closeLitebox();

Answer 1

也许不要在 litebox 函数中关闭它，而是尝试阻止它进入它？

你可以尝试:

var isMobile = window.matchMedia("only screen and (max-width: 760px)");

if (!isMobile.matches) {
    $('.litebox').liteBox...
}