// ==UserScript==

// @name bilibili HTML5播放器

// @author nanavao

// @namespace nana_vao_script

// @description 启用bilibili的html5播放器,自动宽屏、原生右键菜单

// @version 1.23

// @include http://www.bilibili.com/video/av*

// @include http://bangumi.bilibili.com/anime/v/*

// @run-at document-start

// @grant GM_setValue

// @grant GM_getValue

// @grant GM_deleteValue

// ==/UserScript==

'use strict';

(function () {

let url = GM_getValue('url');

GM_deleteValue('url');

if (location.hostname == 'bangumi.bilibili.com') {

if(url === location.href){

return;

}

GM_setValue('url', location.href);

document.addEventListener('DOMContentLoaded', function () {

window.stop();

location.href = document.querySelector('.v-av-link').href;

});

} else {

try{

localStorage.setItem('bilibililover', 'YESYESYES');

localStorage.setItem('defaulth5', '1');

}catch(e){}

window.addEventListener('load', function () {

this.$ = unsafeWindow.jQuery;

$('.bilibili-player-video-btn-widescreen').click();

scrollToPlayer();

let intervalId = setInterval(function(){

if($('.bilibili-player-video-wrap video').length){

setContextMenuHandler();

clearInterval(intervalId);

}

},500);

});

}

function scrollToPlayer(){

var player = $('#bilibiliPlayer');

if($(window).scrollTop() === 0){

$(window).scrollTop(player.offset().top + player.height() - $(window).height());

}

}

function setContextMenuHandler(){

let contextMenuEvent = $._data( document.querySelector('.bilibili-player-video-wrap'), "events" ).contextmenu[0];

let oldHandler = contextMenuEvent.handler;

let isElementClicked = function(ele, x, y){

let rect = ele.getBoundingClientRect();

return ((x > rect.left) && (x < rect.right) && (y > rect.top) && (y < rect.bottom));

};

let anyElementClicked = function(arr,x,y){

for(let i = 0;i < arr.length; i++){

if(isElementClicked(arr[i],x,y)){

return true;

}

}

return false;

};

let newHandler = function(e){

let eleArr = document.querySelectorAll('.bilibili-danmaku');

if(anyElementClicked(eleArr,e.clientX,e.clientY)){

oldHandler(e);

}

};

contextMenuEvent.handler = exportFunction(newHandler,contextMenuEvent);

}

}) ();

bilibili登录页面代码html5,bilibili HTML5播放器相关推荐

  1. bilibili登录页面代码html5,GitHub - Attect/Bilibili-HTML5-Random-Play: 基于TamperMonkey的B站网页端随机播放功能插件...

    Bilibili-HTML5-Random-Play 基于TamperMonkey的B站网页端随机播放功能插件. B站新版网页看起来不错,但依然没有增加随机播放功能,一些分P巨多的音乐视频合集播放起来 ...

  2. php手机端 调用音乐播放器,HTML_仿酷狗html5手机音乐播放器主要部分代码,HTML5作品,经测试,效果确定 - phpStudy...

    仿酷狗html5手机音乐播放器主要部分代码 HTML5作品,经测试,效果确定不错,遗憾的是只支持谷歌和苹果等以webkit核心的浏览器,网友体验的时候请使用谷歌等浏览器来运行,不然的话无法看到效果,不 ...

  3. html音乐播放器代码自动,html5 css3音乐播放器代码

    特效描述:html5 css3 音乐播放器代码.html5 css3音乐播放器代码 代码结构 1. 引入CSS 2. 引入JS 3. HTML代码 标题歌手 00:00/00:00 var music ...

  4. 手机html音乐播放器代码隐藏,教程方法;仿酷狗html5手机音乐播放器主要部分代码电脑技巧-琪琪词资源网...

    琪琪词资源网-教程方法;仿酷狗html5手机音乐播放器主要部分代码电脑技巧,以下是给大家带来的教程方法;仿酷狗html5手机音乐播放器主要部分代码,大家可以了解一下哦! HTML5作品,经测试,效果确 ...

  5. html在线音频播放器实训总结,HTML5音乐列表播放器SMusic开发总结

    前段时间写过一篇介绍简单音乐播放器效果开发的博文<为你的博客添加简单的CSS3音乐播放器>,实现了单曲循环播放效果,这个效果也是我的博客首页一直有的效果,同时文中也介绍了一些简单的HTML ...

  6. html5 audio音频播放器

    html5开启了一个新时代,因为它让浏览器本身变得不那么被动,audio api就是一个典型的列子,在html5还没确定之前,如果想要在网页上听音乐看视频唯一的办法就是用flash 意思是当你没有给浏 ...

  7. 带倍速播放的播放器_带有HTML5的MP3播放器

    带倍速播放的播放器 MP3 Player with HTML5 In you are a beginner in HTML5 and you are looking for new knowledge ...

  8. html5中audio播放器标签属性整理

    html5中audio播放器标签属性整理 HTML5 元素 audio播放器隐藏 audio标签控制函数功能说明 audio 可脚本控制的特性值 只读属性属性说明 HTML5 元素 元素是一个 HTM ...

  9. 绝对零度试验机的创造战记:2.小型HTML5本地音乐播放器

    绝对零度试验机的创造战记:2.小型HTML5本地音乐播放器 二前记: 接触HTML5和Javascript已经有三四个月了,一直都是半桶水程度,当然,想达到满水的程度还真不是那么简单. 之前买过一本H ...

最新文章

  1. 电厂运维的cis数据_【面向运行人员的电站智能运维管家系统】
  2. spring框架学习(二)依赖注入
  3. 开关怎么使用_开关也能自发电?ebelong易百珑S2自发电无线开关曝光
  4. shell 命令 链接文件 ln
  5. 习惯看新闻头条 一个程序员分享的工作心得
  6. linux刷命令脚本,linux – 如何调试bash脚本并获得每个命令的执行时间
  7. 向iOS开发者介绍C++
  8. java kafka分布式_JavaWeb项目架构之Kafka分布式日志队列
  9. Linux之SWIG安装(无需安装pcre依赖)
  10. Dart基础第11篇:抽象类 多态 以及接口
  11. Windows使用ffmpeg教程
  12. python-opencv视频转图片+图片转视频(步骤详解)(亲测有效)
  13. 适合WhatsApp网页版的4个最好的免费WhatsApp 群发工具
  14. 要闻丨腾飞•新征程,人大金仓完成近亿元融资
  15. Win11打印机脱机了怎么重新连接?Win11打印机脱机的解决方法
  16. 各代iphone尺寸_历代iPhone尺寸对比,你最喜欢哪一代?
  17. 2020-01-04
  18. oracle收集snop,Oracle 9i 使用Statpack snap 步骤和说明
  19. SDUST 第四次实验
  20. matlab射影几何,一种利用单幅图像的现场摄像机自标定方法

热门文章

  1. 用javascript调用搜狗地图实现景点的显示
  2. 360全景夜景拍摄的五大要点
  3. 2018年ERP的自我救赎
  4. 算法工程-Faiss原理和使用总结
  5. RHEL8 学习记录 #1 从官网下载 RHEL 8 镜像真的很快
  6. 微信小程序 跳转小程序
  7. 2017年天梯赛大区赛题集 7-13 非常弹的球 (30 分)(物理)
  8. Spring Boot 官方文档摘要
  9. WPS忘记保存关闭了如何恢复
  10. UVA 1388 Graveyard 的分析