- 浏览: 7856253 次
- 性别:
- 来自: 广州
文章分类
- 全部博客 (2425)
- 软件工程 (75)
- JAVA相关 (662)
- ajax/web相关 (351)
- 数据库相关/oracle (218)
- PHP (147)
- UNIX/LINUX/FREEBSD/solaris (118)
- 音乐探讨 (1)
- 闲话 (11)
- 网络安全等 (21)
- .NET (153)
- ROR和GOG (10)
- [网站分类]4.其他技术区 (181)
- 算法等 (7)
- [随笔分类]SOA (8)
- 收藏区 (71)
- 金融证券 (4)
- [网站分类]5.企业信息化 (3)
- c&c++学习 (1)
- 读书区 (11)
- 其它 (10)
- 收藏夹 (1)
- 设计模式 (1)
- FLEX (14)
- Android (98)
- 软件工程心理学系列 (4)
- HTML5 (6)
- C/C++ (0)
- 数据结构 (0)
- 书评 (3)
- python (17)
- NOSQL (10)
- MYSQL (85)
- java之各类测试 (18)
- nodejs (1)
- JAVA (1)
- neo4j (3)
- VUE (4)
- docker相关 (1)
最新评论
-
xiaobadi:
jacky~~~~~~~~~
推荐两个不错的mybatis GUI生成工具 -
masuweng:
(转)JAVA获得机器码的实现 -
albert0707:
有些扩展名为null
java 7中可以判断文件的contenttype了 -
albert0707:
非常感谢!!!!!!!!!
java 7中可以判断文件的contenttype了 -
zhangle:
https://zhuban.me竹板共享 - 高效便捷的文档 ...
一个不错的网络白板工具
这次接着介绍5个更多HTML 5的API。这些API还是很实用的。
1 fullscreen全屏api,可惜不是全部浏览器支持,播放视频,做游戏时有用
2 page visiablity页面可见性判断的API
这个可以用来判断当用户的焦点不在当前tab的时候触发,下面这个例子,当CHROME下运行时候,如果新建立一个TAB,并且焦点到了新的tab,则会发现原来的页面的标题的title属性显示为"hidden"了
不错的关于这个功能的详细教程:
http://davidwalsh.name/page-visibility
3 getUserMedia api 获得访问媒体设备的API
可以允许调用用户的媒体设备,比如camera等。
更具体的教程见:
http://davidwalsh.name/browser-camera
4 电池API
可以获得电池的工作状态
这个对移动设备很有效果,相关教程:
http://davidwalsh.name/battery-api
可惜这东西暂时只自mozilla下有效果
5 页面元素预加载 prefetch
主要是浏览器加载完页面后,将其放到浏览器的cache中去,
教程:http://davidwalsh.name/html5-prefetch
1 fullscreen全屏api,可惜不是全部浏览器支持,播放视频,做游戏时有用
function launchFullScreen(element) { if(element.requestFullScreen) { element.requestFullScreen(); } else if(element.mozRequestFullScreen) { element.mozRequestFullScreen(); } else if(element.webkitRequestFullScreen) { element.webkitRequestFullScreen(); } } // Launch fullscreen for browsers that support it! launchFullScreen(document.documentElement); launchFullScreen(document.getElementById("videoElement")); //点单独的与元素时启动
2 page visiablity页面可见性判断的API
这个可以用来判断当用户的焦点不在当前tab的时候触发,下面这个例子,当CHROME下运行时候,如果新建立一个TAB,并且焦点到了新的tab,则会发现原来的页面的标题的title属性显示为"hidden"了
var hidden, state, visibilityChange; if (typeof document.hidden !== "undefined") { hidden = "hidden"; visibilityChange = "visibilitychange"; state = "visibilityState"; } else if (typeof document.mozHidden !== "undefined") { hidden = "mozHidden"; visibilityChange = "mozvisibilitychange"; state = "mozVisibilityState"; } else if (typeof document.msHidden !== "undefined") { hidden = "msHidden"; visibilityChange = "msvisibilitychange"; state = "msVisibilityState"; } else if (typeof document.webkitHidden !== "undefined") { hidden = "webkitHidden"; visibilityChange = "webkitvisibilitychange"; state = "webkitVisibilityState"; } // Add a listener that constantly changes the title document.addEventListener(visibilityChange, function(e) { // Start or stop processing depending on state }, false);
不错的关于这个功能的详细教程:
http://davidwalsh.name/page-visibility
3 getUserMedia api 获得访问媒体设备的API
可以允许调用用户的媒体设备,比如camera等。
window.addEventListener("DOMContentLoaded", function() { // Grab elements, create settings, etc. var canvas = document.getElementById("canvas"), context = canvas.getContext("2d"), video = document.getElementById("video"), videoObj = { "video": true }, errBack = function(error) { console.log("Video capture error: ", error.code); }; // 播放 if(navigator.getUserMedia) { // Standard navigator.getUserMedia(videoObj, function(stream) { video.src = stream; video.play(); }, errBack); } else if(navigator.webkitGetUserMedia) { // WebKit系列浏览器 navigator.webkitGetUserMedia(videoObj, function(stream){ video.src = window.webkitURL.createObjectURL(stream); video.play(); }, errBack); } }, false);
更具体的教程见:
http://davidwalsh.name/browser-camera
4 电池API
可以获得电池的工作状态
var battery = navigator.battery || navigator.webkitBattery || navigator.mozBattery; console.warn("Battery charging: ", battery.charging); // true console.warn("Battery level: ", battery.level); // 0.58 console.warn("Battery discharging time: ", battery.dischargingTime); //电池的监听 battery.addEventListener("chargingchange", function(e) { console.warn("Battery charge change: ", battery.charging); }, false);
这个对移动设备很有效果,相关教程:
http://davidwalsh.name/battery-api
可惜这东西暂时只自mozilla下有效果
5 页面元素预加载 prefetch
主要是浏览器加载完页面后,将其放到浏览器的cache中去,
<link rel="prefetch" href="http://davidwalsh.name/css-enhancements-user-experience" /> <link rel="prefetch" href="http://davidwalsh.name/wp-content/themes/walshbook3/images/sprite.png" />
教程:http://davidwalsh.name/html5-prefetch
发表评论
-
微信开发工具中时间问题的小坑
2018-02-07 19:07 759刚开始用微信小程序开发工具,每次运行任何应用,都报这个错误: ... -
三篇不错的介绍CSS GRID的文章
2017-12-06 09:08 483三篇不错的介绍CSS GRID的文章: http://www. ... -
双因素认证(2FA)教程
2017-11-03 09:16 1463http://www.ruanyifeng.com/blog/ ... -
es6 中的export
2017-08-20 08:00 772https://juejin.im/post/5998625f ... -
markdown中的空格
2017-08-20 07:53 1654即使手动输入空格, 也是很不推荐的方法。我推荐全角空格,切换 ... -
(转)讲真,别再使用JWT了
2017-08-17 23:21 962不错的好文: http://insights.thoughtw ... -
(转)手把手教你WebStorm+chrome实现时时调试刷新
2017-08-15 10:50 2979参考: http://jingyan.baidu.com/ar ... -
IntelliJ Idea 2017 免费激活方法
2017-08-15 09:38 92661. 到网站 http://idea.lanyus.com/ ... -
前端框架这么多,该何去何从?
2017-08-04 07:17 603http://insights.thoughtworkers. ... -
记录一个HTML 5画拓扑图的商业公司
2017-07-18 19:56 811http://qunee.com/ DEMO:http:// ... -
vue 2例子学习收集
2017-07-16 11:46 9541 vue2.0手撸闲鱼App https://githu ... -
(收藏)虚拟DOM内部是如何工作的
2017-07-13 22:08 551虚拟DOM内部是如何工作的 https://segmentfa ... -
最近看到的几篇精彩JAVASCRIPT博客文章推荐
2017-07-11 07:10 525【深度长文】JavaScript数组所有API全解密 http ... -
jsonp 跨域原理:深入浅出 jsonp
2017-07-10 19:55 1386https://lzw.me/a/jsonp.html jso ... -
(转)深度长文-JavaScript数组所有API全解密
2017-07-08 19:59 780深度长文-JavaScript数组所有API全解密 http: ... -
(收藏)网页导出PDF的方案
2017-07-06 07:13 911(收藏)网页导出PDF的方案 https://yiqiwuli ... -
Chromium 新的弹窗机制以及 HTML 的 <dialog> 元素
2017-06-28 12:37 1113https://juejin.im/post/59525195 ... -
国内一个不错的大屏UI设计厂家
2017-06-03 19:43 3123http://www.lanlanwork.com/dp.ph ... -
canvas仿芝麻信用分仪表盘
2017-05-28 20:21 1525canvas仿芝麻信用分仪表盘 https://segment ... -
(转)CSS 变量教程
2017-05-10 21:12 527http://www.ruanyifeng.com/blog/ ...
相关推荐
本次实验主要包含了两个基于HTML5媒体API的应用设计实例,一是基于HTML5音频API的音乐播放器的设计与实现,二是基于HTML5视频API的在线教学视频的设计与实现。要求做基于HTML5音频API的音乐播放器的设计与实现,基于...
对于广大开发人员和设计者,究竟该如何入手HTML5及获取相关...以下是广大HTML5技术爱好者学习和参考相关技术不可错过的12家外网,它们或是采用HTML5技术开发出的案例,或是HTML5相关的学习资源,供国内的开发人员参阅。
unity5圣典中文API手册v0.02.chm,可离线使用。本手册适合新手使用。
java.sql 提供使用 JavaTM 编程语言访问并处理存储在数据源(通常是一个关系数据库)中的数据的 API。 java.text 提供以与自然语言无关的方式来处理文本、日期、数字和消息的类和接口。 java.text.spi java.text ...
jquary中文api和css中文手册,初学者必不可少的工具…
ext 3.3.1 api 不可缺少的学习资料 ext 3.3.1 api 不可缺少的学习资料 ext 3.3.1 api 不可缺少的学习资料
1.内容概要 本手册为JDK-API-1.8版本,java中文版api手册。JDK是 Java 语言的软件开发工具包,主要用于移动设备、嵌入式设备上的java应用程序。JDK是整个java开发的核心,它包含了JAVA的运行环境(JVM...不可随意传播哦
EXT中文API帮助,没什么可说的。 EXT中文API帮助,没什么可说的。 EXT中文API帮助,没什么可说的。 EXT中文API帮助,没什么可说的。
一款很好的HTML5开发手册,在没有外网的情况也可查阅
jsTree中文api文档,js操作树可移动节点 增加修改删除节点.jsTree中文api文档,js操作树可移动节点 增加修改删除节点.
一本涉及高级内容应用的HTML5教程,HTML5 Canvas_2D API规范1.0中文版,Canvas在HTML5有着重要意义,可以说是HTML5强大功能亮点的体现,本教程可看作是一本HTML5的Canvas API手册,包括了CANVAS接口元素定义、...
该资源可帮助搞移动跨平台开发的哥们提高底层调用的内功!
jsoup爬虫API,可解析和遍历HTML文档,解析一个HTML字符串,从一个URL加载一个Document,从一个文件加载一个文档等
CAN总线详细教程,精心编制,不可错过.
C# 中操作API,作为初学者来说,在C#中使用API确是一件令人头疼的问题。在使用API之间你必须知道如何在C#中使用结构、类型转换、安全/不安全代码,可控/不可控代码等许多知识。
本软件就是专为易语言编写的功能强大的API函数辅助工具,使用方便,有中文说明,数据齐全,已经收集有函数6570个,数据类型419个,常量32000多个。功能简介: 1. 采用表格显示方式,方便查看。 2. 常用函数提供中文...
模拟登录各类网站,操作api完成各种不可描述的事情
这个是QT API 中文参考文档,是做QT界面开发必不可少的工具书
FastAPI 是一个高性能,易学,快速编码,可用于生产环境的API开发框架
jquery中文Api 共两个,一个带目录,可搜索,另一个按字母排序