canvas实现点击指定切换元素的圆形弧线进度条动画效果
这是一个使用画布canvas做的通过点击元素实现弧线运动到指定位置的动画效果。实现原理和前面分享的《Canvas百分比动画进度条》教程一样，区别是增加了一个点击事件来传递参数使弧线动画运动到指定位置。思路很简单，代码也很简单。
HTML代码：
<div class="canvas">
<canvas id="circle" width="644" height="640...
支持跟随鼠标方向的Canvas 3D粒子波浪动画效果代码
偶尔会用到的3D效果，由粒子构成的波浪形状，并以波浪形态运动的3D动画效果，支持鼠标摆动方向。
该效果基于JavaScript 3D库three.js，一个易于使用、轻量级、跨浏览器、通用的3D库。three.js库地址：https://github.com/mrdoob/three.js
HTML代码：
<div id="particle"></div>
引...
javascript获取video视频某一帧作为poster封面图片
HTML标签Video的poster属性可以给视频添加一个图片作为视频未开始播放时的封面，但如果不想单独添加图片，也可以通过代码利于canvas获取视频的某一帧作为封面图片。
HTML代码：
<video
id="cvideo"
src="upload/video.mp4"
webkit-playsinline="true"...
javascript利用canvas lineTo结合参数方程绘制椭圆（支持IE）
目前使用canvas画布绘制椭圆形的方法有 ellipse()、 scale()、贝塞尔曲线以及 lineTo()，其中比较推荐 ellipse()，但是该方法尚未纳入标准，IE全系列浏览器都不支持，其它浏览器目前比较好。
如果想兼容IE浏览器，可以考虑使用 lineTo() 方法，但是如果要绘制的椭圆像素较大，会存在很大的效率问题，甚至浏览器崩溃，但是小又少的椭圆影响不大。
HTML代码...
js+canvas鼠标悬停圆弧边框动态加载效果
鼠标悬停在div元素时，实现圆弧边框加载效果。
HTML代码：
<div class="btn">
<canvas width="44" height="44" id="btn"></canvas>
</div>
CSS代码：
.btn {width:44px;height:44px;border-radius:50%;borde...
html5 canvas实现背景鼠标连线动态效果代码解析
很流行的动态背景连线特效。下面的代码是作者在扒下来的代码上进行整理和注释，很适应参考学习。
效果截图：
效果演示：https://jc1144096387.github.io/canvas_nest/
作者地址：https://blog.csdn.net/u013556477/article/details/82819785
HTML代码（测试代码）:
<!...
Canvas百分比动画进度条
HTML代码：
<ul id="canvas">
<li>
<canvas class="canvas" width="900" height="900"></canvas>
<span>70%</span>
</li>
<li>...
