Greasy Fork

Greasy Fork is available in English.

B站直播弹出播放（画中画）

为B站直播添加PictureInPicture（画中画）

当前为 2019-06-06 提交的版本，查看 最新版本。

// ==UserScript==
// @name         B站直播弹出播放（画中画）
// @namespace    None
// @version      1.11
// @description  为B站直播添加PictureInPicture（画中画）
// @author       IceCat
// @match        https://live.bilibili.com/*
// @run-at       document-end
// @grant        none
// ==/UserScript==
$(window).load(()=>{
    addButton();
    $("div.bilibili-live-player-video > video")[0].addEventListener('enterpictureinpicture', function(pipWindow) {
        $('#PiPtext')[0].innerText="关闭画中画"
    })

    $("div.bilibili-live-player-video > video")[0].addEventListener('leavepictureinpicture', function() {
        $('#PiPtext')[0].innerText="开启画中画"
    })
})

function switchpip() {
    if($(document)[0].pictureInPictureElement == null){
        $("div.bilibili-live-player-video > video")[0].requestPictureInPicture();
    }else{
        document.exitPictureInPicture();
    }
}

function addButton() {
    var newDiv = document.createElement('div');
    newDiv.style='position: fixed;z-index: 999;right:0;top: 60px;text-align: center;background-color: white;padding: 10px 5px;border-radius: 15px;cursor: pointer;'
    newDiv.innerHTML = '<div data-v-d4bf95e6="" data-v-75753219="" class="side-bar-btn-cntr" id="PiP" herf="javascript:void(0)"><span data-v-d4bf95e6="" class="side-bar-icon dp-i-block point svg-icon"><!----></span><p data-v-d4bf95e6="" class="size-bar-text color-#0080c6" style="color: rgb(0, 128, 198);" id="PiPtext"">开启画中画</p></div>';

    var sidebar = $('#sidebar-vm')[0];

    sidebar.appendChild(newDiv);

    $('#PiP').click(switchpip);
}



(function() {
    'use strict';
    if (!window.jQuery){
        var newScript = document.createElement('script');
        newScript.type = "text/javascript";
        newScript.src="//libs.baidu.com/jquery/2.0.0/jquery.min.js";
        document.head.appendChild(newScript);
    }
})();