给MOOC视频加一个网页全屏功能

直接上代码

// ==UserScript==
// @name         icourse163 mook
// @namespace    http://tampermonkey.net/
// @version      1.0
// @description  webfull play
// @author       JackieZheng
// @match        https://www.icourse163.org/learn/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=icourse163.org
// @grant        GM_addStyle
// ==/UserScript==

GM_addStyle(".u-edu-h5player-controlwrap .m-controlbar{ bottom: 0px !important;}");
GM_addStyle(".u-edu-h5player-controlwrap .bigplaybtn.z-show { display: none !important; }");
GM_addStyle(".playFull{position: fixed !important;top: 0px !important;right: 0px !important;bottom: 0px !important;left: 0px !important;-webkit-box-sizing: border-box !important;box-sizing: border-box !important;min-width: 0px !important;max-width: none !important;min-height: 0px !important;max-height: none !important;width: 100% !important;height: 100% !important;-webkit-transform: none !important;transform: none !important;margin: 0px !important;}");
GM_addStyle(".u-edu-h5player-watermark_content {display: none !important;}");

(function() {
    'use strict';
    document.onkeydown = function(){
        var oEvent = window.event;
        if (oEvent.ctrlKey && oEvent.keyCode ==13) {
            fullPlay();
        }
    }


    // Your code here...
})();

//检测样式
function hasClass(ele, cls) {
    return ele.className.match(new RegExp("(\\s|^)" + cls + "(\\s|$)"));
}
//添加样式
function addClass(ele, cls) {
    if (!hasClass(ele, cls)) ele.className += " " + cls;
}
//删除样式
function removeClass(ele, cls) {
    if (hasClass(ele, cls)) {
        var reg = new RegExp("(\\s|^)" + cls + "(\\s|$)");
        ele.className = ele.className.replace(reg, " ");
    }
}

function fullPlay(){
    let playbox=document.querySelector('.unitctBox');
    let topbar=document.querySelector('.m-nav-container');
    let unitctBar=document.querySelector('.j-unitctBar');
    if(playbox){
        if(hasClass(playbox,'playFull')){
            removeClass(playbox,'playFull');
            topbar.style.display='';
            unitctBar.style.display='';
        }
        else{
            addClass(playbox,'playFull');
            topbar.style.display='none';
            unitctBar.style.display='none';
        }
    }
}



在播放课程页页面 ctrl+enter 切换网页全屏播放。

效果如图:

切换回原始界面 :

注:需要安插浏览器插件支持:Home | Tampermonkey 

猜你喜欢

转载自blog.csdn.net/admans/article/details/142533661