
html5
sweetllh
不疯癫,不成魔
展开
-
canvas绘制时钟
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <canvas id="mycanvas" width="600" height="600"></canvas> </body> <script原创 2017-06-13 17:24:22 · 239 阅读 · 0 评论 -
HTML5本地数据库写留言版功能
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> #box{ width:300px; height:200px;原创 2017-07-30 23:10:37 · 2723 阅读 · 1 评论 -
HTML5本地数据库来做注册登录功能
注册<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <body> 用户名:<input type="text" name="" id="" value="" /> 密码: <input type="passwor原创 2017-07-30 23:08:04 · 29569 阅读 · 5 评论 -
HTML5 本地数据库
HTML5 Web SQL 数据库 在HTML5 WebStorage介绍了html5本地存储的Local Storage和Session Storage,这两个是以键值对存储的解决方案,存储少量数据结构很有用,但是对于大量结构化数据就无能为力了,灵活大不够强大。Web SQL 数据库 API 并不是 HTML5 规范的一部分,但是它是一个独立的规范,引入了一组使用 SQL 操作客户端数据库的 A原创 2017-07-29 16:33:35 · 1164 阅读 · 0 评论 -
HTML5本地存储来注册登录
注册<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <link rel="stylesheet" type="text/css" href="css/reset.css"/> <style type="text/css">原创 2017-07-29 16:24:23 · 5507 阅读 · 4 评论 -
HTML5本地存储
Cookie 数据存储到计算机中,通过浏览器控制添加与删除数据 Cookie的特点 存储限制 域名100个cookie,每组值大小4KB 客户端、服务器端,都会请求服务器(头信息) 页面间的cookie是共享Storage sessionStorage session临时回话,从页面打开到页面关闭的时间段 窗口的临时存储,页面关闭,本地存储消原创 2017-07-29 16:19:15 · 385 阅读 · 0 评论 -
HTML5 --地理位置
地理位置 经度 : 南北极的连接线 纬度 : 东西连接的线位置信息从何而来 IP地址 GPS全球定位系统 Wi-Fi无线网络 基站地理位置对象 navigator.geolocation 单次定位请求 :getCurrentPosition(请求成功,请求失败,数据收集方式) 请求成功函数 经度 : coords.longitude 纬度 : coords.原创 2017-07-29 15:37:45 · 551 阅读 · 0 评论 -
HTML5拖放事件与购物车案例
l拖放事件 •draggable : –设置为true,元素就可以拖拽了 •拖拽元素事件 : 事件对象为被拖拽元素 –dragstart ,拖拽前触发 –drag ,拖拽前、拖拽结束之间,连续触发 –dragend , 拖拽结束触发 •目标元素事件 : 事件对象为目标元素 –dragenter ,进入目标元素触发,相当于mouseover –dragover ,进入目标、离原创 2017-07-29 14:54:27 · 2019 阅读 · 0 评论 -
深度拷贝、浅度拷贝、数组的拷贝
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript">// var a={"name":"hello"};// console.log(typeof(a));原创 2017-07-29 14:29:03 · 382 阅读 · 0 评论 -
canvas与audio结合
<!DOCTYPE html ><html ><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><script>window.onload = function(){ var oV = document.getElementById('v1'原创 2017-07-29 14:24:19 · 1648 阅读 · 0 评论 -
自定义播放器
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <style type="text/css"> *{ padding: 0; margin: 0;原创 2017-07-29 14:19:34 · 503 阅读 · 0 评论 -
HTML5 -video和audio的设置
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <!--controls播放页面,autoplay自动播放,loop循环播放--> <audio id="ad" controls src="img/原创 2017-07-29 14:19:02 · 745 阅读 · 0 评论 -
canvas绘制动态加载圆形百分比
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <div> <canvas width="152" height="152" id="process"></canvas>原创 2017-07-29 10:45:36 · 2030 阅读 · 0 评论 -
canvas实现方块运动
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <body > <canvas id="mycanvas" style="border: 1px solid #000;"></canvas> </body>原创 2017-06-13 18:07:38 · 1127 阅读 · 0 评论 -
canvas实现鼠标划线
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> </head> <body> <canvas id="my" width="1000" height="700" style="border: 1px solid #f00;"></can原创 2017-06-13 17:30:46 · 5367 阅读 · 0 评论 -
HTML5数据库查询
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> //1.创建数据库(数据库名,版本,描述信息,大小) var db=openDatabase('mybd','1原创 2017-07-30 23:11:32 · 7379 阅读 · 0 评论