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

我要避免在Android或Apple设备的小视口上打开litebox。

这是我尝试过的，但没有成功：

$( 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不是函数
  
  $（this）.closeLitebox（）;

最佳答案

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

你可以试试：

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

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

关于javascript - 如何避免在小视口(viewport)上打开灯箱？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/33113601/