layui实现点击按钮全屏

layui实现点击按钮全屏

html：

<!-- 全屏按钮 -->
<li class="layui-nav-item">
    <a href="#" data-toggle="fullscreen"><i class="fa fa-arrows-alt"></i></a>
</li>

javascript：

<script>
    layui.use(['element', 'layer', 'layuimini'], function () {
        var $ = layui.jquery;
            
    //全屏事件 --star
    $(document).on('click', "[data-toggle='fullscreen']", function () {
        var doc = document.documentElement;
        if ($(document.body).hasClass("full-screen")) {
            $(document.body).removeClass("full-screen");
            document.exitFullscreen ? document.exitFullscreen() : document.mozCancelFullScreen ? document.mozCancelFullScreen() : document.webkitExitFullscreen && document.webkitExitFullscreen();
        } else {
            $(document.body).addClass("full-screen");
            doc.requestFullscreen ? doc.requestFullscreen() : doc.mozRequestFullScreen ? doc.mozRequestFullScreen() : doc.webkitRequestFullscreen ? doc.webkitRequestFullscreen() : doc.msRequestFullscreen && doc.msRequestFullscreen();
        }
    });
    // --end

});