那些牛掰的 HTML5的API(二)
1:视频播放器
2:地理定位
我们的支持html5 的浏览器给我们提供一个接口(api),可以用来获取你当前的位置.
主要是通过geolocation(地理位置),对象 ,去访问硬件,来获取到经纬度..
if (navigator.geolocation){
navigator.geolocation.getCurrentPosition(showPosition);
} else{
x.innerHTML="Geolocation is not supported by this browser.";}
}
我们获取到的是一个经纬度。我们调用地图。我们调用百度地图.(街景地图)
3: 拖拽
html5 里面支持拖拽
1)当前拖拽的元素
ondrag 应用于拖拽元素,整个拖拽过程都会调用
ondragstart 应用于拖拽元素,当拖拽开始时调用
ondragleave 应用于拖拽元素,当鼠标离开拖拽元素时调用
ondragend 应用于拖拽元素,当拖拽结束时调用
2)目标元素
ondragenter 应用于目标元素,当拖拽元素进入时调用
ondragover 应用于目标元素,当停留在目标元素上时调用
ondrop 应用于目标元素,当在目标元素上松开鼠标时调用
ondragleave 应用于目标元素,当鼠标离开目标元素时调用
4: web 存储
我们通过sessionStorage 和 localStorage 这两个对象可以向本地保存数据。
setItem(key,value)
getItem();
removeItem();
clear();
通过这个对象sessionStorage 演示了这四个方法. (设计到数据的操作就是增删改查..)
localStorage 保存数据 ;方法的一样的
sessionStorage 与 localStorage 区别
①localStorage 的数据永久保存
②sessionStorage 关闭浏览器就没有了
5:应用级别的缓存(缓存文件,css,js 图片.)
我们新建一个html 文件 然后我要为这个html 文件制定缓存的
首先第一步,我要新建一个 demo.appcache
然后在html 里面引用这个 demo.appcache 文件
manifest="demo.appcache"
然后我们要指定缓存的数据 ,在 demo.appcache 缓存文件里面指定
第一行:
CACHE MANIFEST
我需要指定那些文件需要缓存
CACHE:
需要缓存的文件的路径
NETWORK:
那些文件需要网络才能访问.
那些牛掰的 HTML5的API(二)的更多相关文章
- HTML5 Geolocation API地理定位整理(二)
Geolocation 实例demo 1.使用watchPosition()监听客户端位置 var watchOne=null; if (navigator.geolocation) { //watc ...
- HTML5 程序设计 - 使用HTML5 Canvas API
请你跟着本篇示例代码实现每个示例,30分钟后,你会高喊:“HTML5 Canvas?!在哥面前,那都不是事儿!” 呵呵.不要被滚动条吓到,很多都是代码和图片.我没有分开写,不过上面给大家提供了目录,方 ...
- HTML5 Drop API
转自:http://www.cnblogs.com/fsjohnhuang/p/3961066.html 一.前言 在HTML4的时代,各前端工程师为了实现拖拽功能可说是煞费苦心,初听HTML5 ...
- HTML5 history API实践
一.history API知识点总结 在HTML4中,我们已经可以使用window.history对象来控制历史记录的跳转,可以使用的方法包括: history.forward();//在历史记录中前 ...
- html5 Canvas API
详细内容请点击 1.HTML Canvas API有两方面优势可以弥补:首先,不需要将所绘制图像中的每个图元当做对象存储,因此执行性能非常好:其次,在其他编程语言现有的优秀二维绘图API的基础上实现C ...
- HTML5 File api 实现断点续传
目前市场上大多数的网站的断点上传都是需要安装浏览器插件的,本文就针对高级浏览器的环境下,通过HTML5 File api实现断点上传进行说明 一.实现文件多选 HTML5的<input>新 ...
- HTML5 Geolocation API工作原理[转载]
大家都知道,HTML5 Geolocation 可以使用 IP 地址.基于 Web 的数据库.无线网络连接和三角测量或 GPS 技术来确定经度和纬度. 问题: 在一个基于地理位置服务的个人业余项目(小 ...
- HTML5 Geolocation API地理定位整理(一)
HTML5 Geolocation API 用于获得用户的地理位置. 鉴于该特性可能侵犯用户的隐私,除非用户同意,否则用户位置信息是不可用的. 浏览器支持 Internet Explorer 9+, ...
- HTML5 file API加canvas实现图片前端JS压缩并上传
一.图片上传前端压缩的现实意义 对于大尺寸图片的上传,在前端进行压缩除了省流量外,最大的意义是极大的提高了用户体验. 这种体验包括两方面: 由于上传图片尺寸比较小,因此上传速度会比较快,交互会更加流畅 ...
随机推荐
- 数据库MySQL基本介绍安装使用及文件导入导出
1.数据库(data base) 1.1 简述 把文件存储在一台电脑上(服务器),其他电脑用户可以通过账号密码登陆,通过网络去访问这台电脑上的文件,但是由于每个人的数据是不同的,所以你只能通过自己的账 ...
- 《阿里巴巴Java开发手册》阅读笔记
1.抽象类命名使用 Abstract 或 Base 开头: 异常类命名使用 Exception 结尾: 测试类命名以它要测试的类的名称开始,以 Test 结尾. 2.POJO 类中布尔类型的变量,都不 ...
- TCP心跳的意义
摘自:https://blog.csdn.net/bjrxyz/article/details/71076442 TCP新手误区–心跳的意义 背景 最近面试了很多的学生,发现很多TCP的新手对于TCP ...
- lintcode_114_不同的路径
不同的路径 描述 笔记 数据 评测 有一个机器人的位于一个 m × n 个网格左上角. 机器人每一时刻只能向下或者向右移动一步.机器人试图达到网格的右下角. 问有多少条不同的路径? 注意事项 n和 ...
- MappingException:class com.zsn.crm.Model.user not found whie looking for property user id
之前好好地运行 什么东西都没动过 再次运行突然报异常*****MappingException:class com.zsn.crm.Model.user not found whie looking ...
- docker官方仓库下载镜像
官方仓库镜像地址:https://hub.docker.com/search/ 以下载mysql为例 进入到详情页后我们看到有很多Tags 我们选择5.7.25版本进行下载 # docker pull ...
- java 微信开发 常用工具类(xml传输和解析 json转换对象)
与微信通信常用工具(xml传输和解析) package com.lownsun.wechatOauth.utl; import java.io.IOException; import java.io. ...
- python__高级 : @修饰器(装饰器)的理解
以下是第一次了解的时候写的东西,有的地方理解不正确,虽已改正但是太片面,请直接看下面第二次修改加上的内容. ---------------------------------------------- ...
- PHP时间日期操作增减(date strtotime) 加一天 加一月
date_default_timezone_set('PRC'); //默认时区 //当前的时间增加5天 $date1 = "2014-11-11"; echo date('Y-m ...
- manjaro无法使用ifconfig查ip
manjaro中自带的查看网络的命令是: ip addr 可以了解一下ip命令都有哪些功能 如果还是想要 ifconfig 需要安装net-tools 安装命令: sudo pacman -S net ...