当前位置:网站首页>谷歌浏览器实现视频播放加速功能
谷歌浏览器实现视频播放加速功能
2020-11-06 21:45:00 【会开车的架构师】
chrome浏览器控制台创建js脚本并执行
Chrome的snippets是小脚本,还可以创作并在Chrome DevTools的来源面板中执行。您可以访问和从任何页面运行它们。当你运行一个片段,它从当前打开的页面的上下文中执行。本文主要讲如何使用,并完成一个页面自动刷新的功能。
第一步
首先f12 打开开发者工具,再打开Sources面板中,单击上Snippets选项卡,在导航器中单击鼠标右键,然后选择New。
第二步
在编辑器中输入代码。当你有未保存的更改,您的脚本名称旁边有“*”,像下面的截图。按Command+S(Mac)或Ctrl+S(Windows和Linux),以保存更改。
第三步运行你的代码片段
有三种方式:
1、在片段文件名(在左侧窗格中列出了所有的片段)右键单击并选择“RUN”。
2、点击运行按钮()。
3、按Command+Enter(Mac)或Ctrl+Enter(Windows和Linux)。
例如:视频加速播放功能实现。
// 加速播放
document.getElementById(“tcPlayer_html5_api”).playbackRate = 3
// 空格键控制播放
document.onkeyup = function (event) {
var e = event || window.event || arguments.callee.caller.arguments[0];
var obj = document.getElementById(“tcPlayer_html5_api”);
if (e && e.keyCode == 32) {
obj.paused === true ? obj.play() : obj.pause();
return false;
} else if (e && e.keyCode == 37) {
obj.currentTime !== 0 ? obj.currentTime -= 20 : 1;
return false;
} else if (e && e.keyCode == 39) {
obj.currentTime !== obj.duration ? obj.currentTime += 20 : 1;
return false;
} else if (e && e.keyCode == 38) {
obj.volume <= 0.9 ? obj.volume += 0.1 : 1;
return false;
} else if (e && e.keyCode == 40) {
obj.volume >= 0.1 ? obj.volume -= 0.1 : 1;
return false;
}
};
版权声明
本文为[会开车的架构师]所创,转载请带上原文链接,感谢
https://my.oschina.net/u/4629483/blog/4529693
边栏推荐
- 每个大火的“线上狼人杀”平台,都离不开这个新功能
- Behind the record breaking Q2 revenue of Alibaba cloud, the cloud opening mode is reshaping
- C語言I部落格作業03
- StickEngine-架构11-消息队列(MessageQueue)
- 华为云微认证考试简介
- How to get started with new HTML5 (2)
- es创建新的索引库并拷贝旧的索引库 实践亲测有效!
- What course of artificial intelligence? Will it replace human work?
- What if the front end doesn't use spa? - Hacker News
- The importance of big data application is reflected in all aspects
猜你喜欢
Contract trading system development | construction of smart contract trading platform
只有1个字节的文件实际占用多少磁盘空间
Read the advantages of Wi Fi 6 over Wi Fi 5 in 3 minutes
C# 调用SendMessage刷新任务栏图标(强制结束时图标未消失)
嘉宾专访|2020 PostgreSQL亚洲大会阿里云数据库专场:王涛
前端未來趨勢之原生API:Web Components
An article takes you to understand CSS pagination examples
2020年第四届中国 BIM (数字建造)经理高峰论坛即将在杭举办
【自学unity2d传奇游戏开发】地图编辑器
How does filecoin's economic model and future value support the price of fil currency breaking through thousands
随机推荐
MongoDB与SQL常用语法对应表
Basic usage of Vue codemirror: search function, code folding function, get editor value and verify in time
解决 WPF 绑定集合后数据变动界面却不更新的问题
JNI-Thread中start方法的呼叫與run方法的回撥分析
Outsourcing is really difficult. As an outsourcer, I can't help sighing.
Small program introduction to proficient (2): understand the four important files of small program development
CCR coin frying robot: the boss of bitcoin digital currency, what you have to know
Digital city responds to relevant national policies and vigorously develops the construction of digital twin platform
It's time for your financial report to change to a more advanced style -- financial analysis cockpit
How to turn data into assets? Attracting data scientists
Get twice the result with half the effort: automation without cabinet
Git rebase is in trouble. What to do? Waiting line
To teach you to easily understand the basic usage of Vue codemirror: mainly to achieve code editing, verification prompt, code formatting
游戏开发中的新手引导与事件管理系统
行为型模式之解释器模式
Ronglian completed US $125 million f round financing
[efficiency optimization] Nani? Memory overflow again?! It's time to sum up the wave!!
Pn8162 20W PD fast charging chip, PD fast charging charger scheme
GitHub: the foundation of the front end
An article will take you to understand SVG gradient knowledge