
html5
twinkle||cll
More interest,less interests (多一些兴趣爱好的向往,少一些功名利禄的追求)
展开
-
前端网络基础
学习网络 互联网—— Internet(音译:因特网,英特网),网际网路1989年 欧洲粒子物理研究生——协议(格式)WWW (world wide web) 万维网普及: 1991年二、计算机的连接方式:计算机A ——— 网线———计算机B计算机两两通过网线连接,实现计算机之间的通讯冯诺依曼(计算机之父)式计算机运算器:...原创 2020-05-01 22:19:39 · 345 阅读 · 0 评论 -
h5 fetch的 原理 使用 学习总结
==================Fetch 简介 =========================== XMLHttpRequest 的问题 1. 所有的功能全部集中在同一个对象上,容易书写出混乱不易维护的代码 2. 采用传统的事件驱动模式,无法适配新的 Promise Api Fetch Api 的特点 1. 并非取代 AJAX, 而是对 AJAX传统的 API 2. 精细的功能分隔: 头部信息,...原创 2020-06-19 22:38:08 · 647 阅读 · 0 评论 -
h5 的api接口 地理位置,重力感应,摇一摇,requestAnimationFrame,localStorage,history,worker
==========================获取地理位置信息==========================定位(GPS), 台式机几乎没有GPS,笔记本绝大多数都没有GPS, 智能手机几乎都有GPS电脑的定位方法: 使用网络,通过基站来粗略的估计你的地理位置<script> window.navigator.geolocation.geolocation(function (position) { // 这个是成功的回调函数 },...原创 2020-06-07 10:03:28 · 403 阅读 · 0 评论 -
elemenui使用el-container布满整个屏幕
1.在使用el-container的时候会发现,如果我们想要让一个布局布满整个屏幕,实现自适应的效果,但是会发现要实现这个方法还要一定的css的功底,像我的功底就比较菜了,然后去网站找结果,但是啥度没有找到,写此文章留作自己的笔记,大神有更好的实现方法可以一起交流。我的实现代码如下: Header ...原创 2019-10-18 14:14:56 · 5258 阅读 · 1 评论 -
canvas实现海报 两张图片合成一张并且可以保存
<style> * { margin: 0; padding: 0; } :root, html, body { height: 100vh; width: 100vw; } </style></head> <img src='' alt='海报'>原创 2020-05-22 15:09:22 · 1346 阅读 · 0 评论 -
canvas 实现雪花飘落 html5
<style> * { margin: 0; padding: 0; } :root, html, body { width: 100vw; height: 100vh; } #canvas { background-color: #000000; ..原创 2020-05-22 13:29:51 · 625 阅读 · 0 评论 -
html5 h5学习总结
新增的属性placeholder,Calendar,date,time,email,url,search,contentEditable,hidden,contenx-menu,data-val(自定义属性)新增的标签语义化标签(一群类似div的东西)canvas(画板)svg(画板)Audio(声音播放)Video(视频播放)API定位(需要地理位置的功能)重力感应(陀螺仪,如:微信里面的摇一摇,赛车游戏)request-animation-frame..原创 2020-05-16 16:45:44 · 1063 阅读 · 0 评论 -
html5 h5使用canvas 画一个圆角矩形
使用canvas画圆角矩形 (4条边, 4个角)ctx.moveTo 先设置起点A点 下面的(x,y)是B点, (x1, y1)是C点 方向,往哪边边拐ctx.arcTo(x, y, x1, y1, 圆角大小) B点是A点与C点在圆弧上切线的交点, <canvas id="can" width="500" height="300"></canvas><script> var canvas = document.getElementById('can'原创 2020-05-16 10:33:54 · 1942 阅读 · 0 评论 -
html5 h5 draggable的理解,及其实现拖拽功能
dragable:默认值为false,可以用于拖拽,但是一个虚拟的。a标签,img标签默认自带拖拽,(只有chrome,safari可以使用,firefox不支持,ie不支持),所有的标签元素,当拖拽周期结束后,默认事件就是回到原处,事件是由行为触发的,但是一个行为不止可以触发一个事件,可以触发多个事件拖拽周期: 拖拽开始,拖拽进行中,拖拽结束拖拽的组成: 被拖拽的物体, 目标区域被拖拽的物体:事件:ondragstart:拖拽开始事件, 拖拽开始需要移动一点才会触发,鼠标按下不会触发, e.原创 2020-05-16 10:25:24 · 2623 阅读 · 0 评论