-
基于 HTML5 Canvas实现 的交互式地铁线路图
所属栏目：[MySql教程] 日期：2020-05-12 热度：178
副标题#e# 前两天在 echarts 上寻找灵感的时候，看到了很多有关地图类似的例子，地图定位等等，但是好像就是没有地铁线路图，就自己花了一些时间捣鼓出来了这个交互式地铁线路图的 Demo，地铁线路上的点是在网上随便下载了一个，这篇文章记录自己的一些收获[详细]
-
详解Canvas 实现炫丽的粒子运动效果（粒子生成文字）
所属栏目：[MySql教程] 日期：2020-05-12 热度：183
副标题#e# 没有最好，只有更好，如题所示，这篇文章只要是分享一个用 Canvas 来实现的粒子运动效果。感觉有点标题党了，但换个角度，勉勉强强算是炫丽吧，虽然色彩上与炫丽无关，但运动效果上还是算得上有点点炫的。不管怎么样，我们还是开始这个所谓的炫丽[详细]
-
HTML5 Canvas图像模糊完美解决办法
所属栏目：[MySql教程] 日期：2020-05-12 热度：98
1、最近在用h5的canvas画动画，发现图像特别模糊。后来终于找到罪魁祸首是meta name=viewport content=width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no /这个代码，因为这行代码进行了伸缩 2、模糊图像的效果： 3、[详细]
-
详解移动端HTML5音频与视频问题及解决方案
所属栏目：[MySql教程] 日期：2020-05-12 热度：168
最近在研究用视频代替动画，用视频代替精灵动画，我们称这种视频叫做交互视频。 传统的精灵动画： 磁盘空间大，下载慢，尤其是在线播放，会更慢 文件太多，在线播放的时候，太多http请求，会导致响应慢，或者行为失常 因此，急需开发了一套技术，用视频代[详细]
-
详解Html5 Canvas画线有毛边解决方法
所属栏目：[MySql教程] 日期：2020-05-12 热度：171
Html5 Canvas 所有的画线指令画出来的线条都有毛边（比如 lineTo， arcTo，strokeRect），这是因为在Canvas中整数坐标值对应的位置恰巧是屏幕象素点中间的夹缝，那么当按这样的坐标进行线条渲染时所要用到的就是夹缝两边的象素点，这样即便设置了lineWidth[详细]
-
详解HTML5 canvas绘图基本使用方法
所属栏目：[MySql教程] 日期：2020-05-12 热度：136
副标题#e# canvas/canvas是HTML5中新增的标签，用于绘制图形，实际上，这个标签和其他的标签一样，其特殊之处在于该标签可以获取一个CanvasRenderingContext2D对象，我们可以通过JavaScript脚本来控制该对象进行绘图。 canvas/canvas只是一个绘制图形的容器[详细]
-
HTML5 video视频字幕的使用和制作方法
所属栏目：[MySql教程] 日期：2020-05-12 热度：189
HTML5允许我们使用 元素为视频指定字幕。这个元素的各种属性允许我们指定这样的东西，比如我们添加的内容的类型，它所在的语言，当然还有对包含实际字幕信息的文本文件的引用。 video id=video controlssource src=http://www.jb51.net/html5/./step.mp4 t[详细]
-
HTML5新增的标签和属性归纳总结
所属栏目：[MySql教程] 日期：2020-05-12 热度：149
收集总结的HTML5的新特性，基本除了IE9以下都可以使用。 HTML5语法 大部分延续了html的语法不同之处：开头的 !DOCTYPE html html lang=zh-CNmeta charset=utf-8 字符编码变得简洁， 不区分大小写， 添加了布尔值，类似checked，selected 引号可以省略，但[详细]
-
在HTML5 canvas里用卷积核进行图像处理的方法
所属栏目：[MySql教程] 日期：2020-05-12 热度：121
就跳过一些用专业属于描述专业术语看完懵逼的解释了， 语文成绩很差的我尝试从字面解释什么是卷积... 卷，理解成一种压缩；积，乘积，积累； 卷积需要一个卷积核，通常是3x3或5x5的方阵， 例如这样 // 一个3x3卷积核 0 0 0 0 1 0 0 0 0 我们要怎么用卷积核[详细]
-
HTML5 拖拽批量上传文件的示例代码
所属栏目：[MySql教程] 日期：2020-05-12 热度：111
该组件基于 Vue.js 实现，UI 框架是 elementUI,完整的 demo 地址在https://github.com/Msxiaoma/upload-folder. 拖拽上传文件夹(仅仅chrome支持) 一、组件描述 同时拖拽多个文件夹 删除指定文件夹 显示当前文件夹的上传进度条 超过5M的文件夹分片上传 效果[详细]
-
html5调用摄像头功能的实现代码
所属栏目：[MySql教程] 日期：2020-05-12 热度：200
副标题#e# 前些天，线上笔试的时候，发现需要浏览器同意开启摄像头，感觉像是 js 调用的，由于当时笔试，也就没想到这么多问题。今天闲来无事，看了下自己的 todo，发现有这个调用摄像头的todo，才想到。网上查了一下，果然 js 有调用摄像头的 api，为此自[详细]
-
简单聊聊H5的pushState与replaceState的用法
所属栏目：[MySql教程] 日期：2020-05-12 热度：140
HTML5引入了 和 方法，它们分别可以添加和修改历史记录条目。这些方法通常与window.onpopstate 配合使用。 二、pushState() 方法的例子 假设在 中执行了以下 JavaScript 代码: var stateObj = { foo: bar };history.pushState(stateObj, page 2, bar.html)[详细]
-
Html5 localStorage入门教程
所属栏目：[MySql教程] 日期：2020-05-12 热度：93
只读的 localStorage 允许你访问一个 Document 的远端（origin）对象 Storage；数据存储为跨浏览器会话。localStorage 类似于 sessionStorage，区别在于，数据存储在 localStorage 是无期限的，而数据存储在 sessionStorage 会被清除，当页面会话结束时也[详细]
-
利用html5 canvas动态画饼状图的示例代码
所属栏目：[MySql教程] 日期：2020-05-12 热度：61
这里并没引用jquery等第三方库，只是用dom操作和canvas的特性编写的。 canvas画圆大体分为实心圆和空心圆。 根据需求分析知道该圆为实心圆。 1.先用canvas画实心圆 //伪代码var canvas = document.createElement(canvas);var ctx = canvas.getContext('2d'[详细]
-
如何使用localstorage代替cookie实现跨域共享数据问题
所属栏目：[MySql教程] 日期：2020-05-12 热度：148
副标题#e# 因为网站系统的日益庞大，不同域名业务，甚至不同合作方网站的cookie可能或多或少需要进行共享使用，遇到这个情况的时候，大家一般想到的是使用登录中心分发cookie状态再进行同步进行解决，成本较高而且实施起来比较复杂和麻烦。 因为cookie在跨[详细]
-
探究 canvas 绘图中撤销（undo）功能的实现方式详解
所属栏目：[MySql教程] 日期：2020-05-12 热度：179
副标题#e# 最近在做网页版图片处理相关的项目，也算是初入了 canvas 的坑。项目需求中有一个给图片添加水印的功能。我们知道，在浏览器端实现图片添加水印功能，通常的做法就是使用 canvas 的 drawImage 方法。对于普通的合成（比如一张底图和一张 PNG 水印[详细]
-
详解canvas在圆弧周围绘制文本的两种写法
所属栏目：[MySql教程] 日期：2020-05-12 热度：134
教程是直接按弧度进行编写的 自己又试着用角度重新编写了一份，有些差别，总结起来还是用弧度比较方便，当然两种哪种理解的容易可以自行斟酌 写代码有时候不一定要按照教程一板一眼的写，最佳实践固然是好，但是自己尝试些别的也许有些别的收获不是么~ 效[详细]
-
HTML5中的网络存储实现方式
所属栏目：[MySql教程] 日期：2020-05-12 热度：126
随着互联网的快速发展，基于网页的应用越来越普遍，同时也变得越来越复杂，为了满足日益更新的需求，会经常性的在本地设备上存储数据，例如记录历史活动信息。传统方式使用document.cookie来进行存储，但是由于其存储的空间只有4KB左右，并且需要复杂的操[详细]
-
HTML5通过navigator.mediaDevices.getUserMedia调用手机摄像头问题
所属栏目：[MySql教程] 日期：2020-05-11 热度：107
副标题#e# navigator.mediaDevices.getUserMedia 应项目要求，需要实现移动端app嵌入H5页面完成实人认证的功能。打开getUserMedia文档，链接如下： https://developer.mozilla.org/zh-CN/docs/Web/API/MediaDevices/getUserMedia 看上去很简单，最终却写的[详细]
-
详解Html5中video标签那些属性和方法
所属栏目：[MySql教程] 日期：2020-05-11 热度：106
最近在写一个自定义播放器, 写之前我们肯定要把播放器的属性和方法全部过一遍,知彼知己,方能百战不殆嘛...后面会把自己写的播放器和踩过的一些坑也上传上来 video标签行内属性 src：视频的URL poster：视频封面，没有播放时显示的图片 preload：预加载 aut[详细]
-
关于前端上传文件全面基础扫盲贴（入门）
所属栏目：[MySql教程] 日期：2020-05-11 热度：111
副标题#e# 为什么分章节写呢？因为覆盖的知识点比较多，也可能我力尽详细介绍，照顾下基础不好的人，温故而知新。 刚开始的确是打算一篇搞定的，写道一半发觉已经相当长篇大论了，好多人例如我一进来看到这么多内容就已经怕了，而且不是每个人都需要了解全[详细]
-
HTML5之多线程(Web Worker)
所属栏目：[MySql教程] 日期：2020-05-11 热度：135
提到 HTML5 总是让人津津乐道，太多的特性和有趣的 API 让人耳目一新。但是很多童鞋还停留在语义化的阶段，忽视了 HTML5 的强劲之处。 这节我们来探讨一下多线程 Web-Worker。 一、明确 JavaScript 是单线程 JavaScript 语言的一大特点就是单线程，也就是[详细]
-
把富文本的回车转为br标签
所属栏目：[MySql教程] 日期：2020-05-11 热度：188
例如：我家孩子在SayABC小班课跟小伙伴们一起互帮互助，合作竞争，学习更加有动力！从简单的单词到句型和场景对话，孩子越来越敢于开口说英语啦！[耶]扫码立即领取外教课[爱心]让孩子从小与世界接轨~ 需要转为才能被html识别，并且换行。可以这样做。 是回[详细]
-
HTML5 WebGL 实现民航客机飞行监控系统
所属栏目：[MySql教程] 日期：2020-05-11 热度：82
副标题#e# 前些日子出差，在飞机上看到头顶的监控面板，除了播放电视剧和广告之外，还会时不时的切换到一个飞机航行的监控系统，不过整个监控系统让人感到有一点点的简陋，所以我就突发奇想制作了一个采用 HT for Web 的升级版监控系统，demo 的效果还行，[详细]
-
基于Canvas+Vue的弹幕组件的实现
所属栏目：[MySql教程] 日期：2020-05-11 热度：64
副标题#e# 最近由于项目需要定制化一个弹幕功能，所以尝试使用canvas来开发组件。经过测试在一些低端机的效果也没有明显的卡顿，和大家交流一下 弹幕效果 功能介绍 支持循环弹幕 弹幕不重叠 支持选择轨道数 支持弹幕发送 使用 npm i vue-barrage 参数配置 n[详细]
