首页 > 其他 > 详细

元素全屏的设置与监听

时间:2017-11-27 19:15:23      阅读:161      评论:0      收藏:0      [点我收藏+]

作者网站:http://hawkzz.com

设置全屏和退出全屏

 //全屏设置
    $('#fullScreen').on('click', function () {
        fullScreen();
    });
 //退出全屏
    $('#exitFullScreen').on('click', function () {
        exitFullScreen();
    });
 //进入全屏
function fullScreen() {
    var obj = document.getElementById('editMark');
    if (obj.requestFullScreen) {
        obj.requestFullScreen();
    } else if (obj.webkitRequestFullScreen) {
        obj.webkitRequestFullScreen();
    } else if (obj.msRequestFullScreen) {
        obj.msRequestFullScreen();
    } else if (obj.mozRequestFullScreen) {
        obj.mozRequestFullScreen();
    }
}

function exitFullScreen() {
    var obj = document.getElementById('editMark');
    if (document.exitFullscree) {
        document.exitFullscree();
    } else if (document.webkitExitFullscreen) {
        document.webkitExitFullscreen();
    } else if (document.msExitFullscreen) {
        document.msExitFullscreen();
    } else if (document.mozCancelFullScreen) {
        document.mozCancelFullScreen();
    }
}

监听全屏事件

//监听全屏
    document.addEventListener('fullscreenchange', function () {
        if (document.fullscreenElement) {
          alert(1);
        } else {
          alert(2);
        }
    }, false);
    document.addEventListener('msfullscreenchange', function () {
        if (document.msFullscreenElement) {
           alert(1);
        } else {
           alert(2);
        }
    }, false);
    document.addEventListener('mozfullscreenchange', function () {
        if (document.mozFullScreen) {
            alert(1);
        } else {
            alert(2);
        }
    }, false);
    document.addEventListener('webkitfullscreenchange', function () {
        if (document.webkitIsFullScreen) {
           alert(1);
        } else {
             alert(2);
        }
    }, false);

元素全屏的设置与监听

原文:http://www.cnblogs.com/hawk-zz/p/7905505.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!