Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
html5 新技术 2
Search
hugo
November 27, 2013
Programming
1
140
html5 新技术 2
主要介绍HTML5新增的JS API
hugo
November 27, 2013
Tweet
Share
More Decks by hugo
See All by hugo
CSS命名及书写规范
baofen14787
0
680
移动端性能调优及16ms优化
baofen14787
1
2.3k
html5 新技术
baofen14787
3
180
html5 新技术 3
baofen14787
1
100
Other Decks in Programming
See All in Programming
Building, Deploying, and Monitoring Ruby Web Applications with Falcon (Kaigi on Rails 2025)
ioquatix
4
2.2k
AIと人間の共創開発!OSSで試行錯誤した開発スタイル
mae616
1
390
チームの境界をブチ抜いていけ
tokai235
0
180
組込みだけじゃない!TinyGo で始める無料クラウド開発入門
otakakot
0
270
他言語経験者が Golangci-lint を最初のコーディングメンターにした話 / How Golangci-lint Became My First Coding Mentor: A Story from a Polyglot Programmer
uma31
0
160
『毎日の移動』を支えるGoバックエンド内製開発
yutautsugi
2
250
大規模アプリのDIフレームワーク刷新戦略 ~過去最大規模の並行開発を止めずにアプリ全体に導入するまで~
mot_techtalk
1
450
はじめてのDSPy - 言語モデルを『プロンプト』ではなく『プログラミング』するための仕組み
masahiro_nishimi
2
490
私達はmodernize packageに夢を見るか feat. go/analysis, go/ast / Go Conference 2025
kaorumuta
2
570
エンジニアインターン「Treasure」とHonoの2年、そして未来へ / Our Journey with Hono Two Years at Treasure and Beyond
carta_engineering
0
130
CSC509 Lecture 04
javiergs
PRO
0
300
overlayPreferenceValue で実現する ピュア SwiftUI な AdMob ネイティブ広告
uhucream
0
180
Featured
See All Featured
Mobile First: as difficult as doing things right
swwweet
224
10k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
359
30k
Thoughts on Productivity
jonyablonski
70
4.9k
KATA
mclloyd
32
15k
Imperfection Machines: The Place of Print at Facebook
scottboms
269
13k
[RailsConf 2023] Rails as a piece of cake
palkan
57
5.9k
Documentation Writing (for coders)
carmenintech
75
5.1k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
132
19k
Principles of Awesome APIs and How to Build Them.
keavy
127
17k
Raft: Consensus for Rubyists
vanstee
140
7.1k
YesSQL, Process and Tooling at Scale
rocio
173
14k
How GitHub (no longer) Works
holman
315
140k
Transcript
HTML5新特性
None
Fullscreen API • 该 允许开发者以编程方式将 应用程序全屏运行。 • 这个 不仅能够使整个页面全屏显示,也可以使页面 中的某个元素全屏显示。
• 设计初衷是为了全屏显示 视频和游戏,以便更全 面的替代 功能。
属性 事件 属性: • :当前全屏显示的 元素。 • :浏览器是否支持全屏( 暂不支持) •
:当前全屏状态 事件: • :全屏状态改变事件 (该事件要绑定在 上,该事件仅在全屏状态改变时触发,默认没有任何动作。 )
None
• 按“ ”键退出全屏。 • 调用“ ”方法退出全屏。
• 标准中,通过 伪 类对全屏的元素进行样式定义。 • 如果该元素全屏后,高度比屏幕还 高,超出的部分将会被隐藏。
注意: • 可以使任意元素全屏显示,不只是整个页面 • 全屏只能从事件触发(用户操作),而不能用代码直接触 发
None
• 页面可见性 就是表示网页可见还是不可见的。(是否 在当前激活 下,是否最小化)
属性 事件 属性: • 值,表示当前页面可见还是不可见 • 返回当前页面的可见状态。 事件: • 当可见状态改变时候触发的事件。
None
• 非可见状态下,动画静止;可见 状态下才正常播放动画。
好处 • 减少内存使用 停止或者暂停不可见页面的耗资源操作。 • 节省服务器资源 举例,当一个进行 轮询的页面不可见时,通过关闭轮询或者加大间隔时 间可以节省一定的服务器资源。 •
视频暂停和自动开始 视频或者动画、游戏 不只是 ,包括 动画 播放时如果需要切换 到其他页面,用户不再需要点暂停,而且切换到该页面时自动从中断点播放。 :
应用场景 • 视频网站广告、视频内容可见性切换与暂停。 • 登录状态同步。 • 在线聊天离开状态。
None
• 这个 能使 获取麦克风和摄像头的访问权限 • 结合 标签和 就能在浏览器中拍摄照片 • 去年编程马拉松获奖作品中大部分用了该
None
应用场景 • 人脸识别 、 物品识别 • 互动游戏 • 以图够物
None
• ,我们的 应用程序可以阅读,浏览,编辑和操 纵本地文件系统。 • 的目标在于满足没能从数据库获得很好服务的客户端 存储使用案例。这些应用一般处理大型二进制 和 或与浏览器 外部环境的应用共享数据。
目前支持的函数 • 读取操作文件: • 创建文件和写入文件, • 针对目录和文件系统的访问:
• 是一个经过良好测试的 封装,能 够方便 应用程序对自己的沙盒文件系统进行文件和文件夹的读写操作。 • 与其它封装库不同之处在于, 采用了不同的方法,它使用了大 家熟悉的 命令
。它的目标是让开发人员觉得 更加平易近人。 •
好处 • 可以在 里面放大量数据,将数据库操作改为本地文件存储。 • 可以在某种程度上提高了重要数据的安全性,一般用户如果没有操作 函数,是不能直接获取到该 文件的路径进而看到内容的。 • 文件格式的多样性,除了保存
文件之外,还可以保存多媒体文件 如 ,图片文件如 。
注意: • 没有对本地操作系统上面的文档文件夹和图片文件夹进行读写。 • 文件系统只能和你 所创建的经过沙盒处理的文件系统 进行交互。也就是说你也不能更改另一个 文件系统中的数 据。
None
• 该 能为应用提供私密沙箱文件存储系统 • 本地存储的数据能够通过链接至 的云备份 服务进行自动同步。
None
• •
表单
None