自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(3)
  • 收藏
  • 关注

原创 C3+Svg实现水球加载动画

在下边water这个盒子里面use两次这个svg矢量图,给其设置不同的填充色,并且给它加上动画,给其中一个加上translate属性让它向右无限做位移动画,那么当两个矢量图做相对运动的时候,就会产生视觉上的欺骗,让人感觉就像水在动一样。到这儿就可以实现一个文章开头一样的数据动态变化的水球加载动画,下边贴出完整代码。当它俩做相对移动的时候,就会产生下边这种效果(通过C3动画实现)然后此处数字以及水动画的动态变化就可以通过定时器+递归来实现。此处是单独一个向右移动(下边蓝色色块是父容器的背景色)

2023-05-27 01:38:30 153 1

原创 SVG实现路径动画

实现过程不难,最主要的就是理解svg的stroke-dasharray(虚线)与stroke-dashoffset(dasharray模式下路径的偏移量)利用svg描边动画实现一个雪糕小demo。

2023-05-23 20:45:23 511

原创 Canvas实现简单时钟表盘

Canvas绘制表盘

2023-05-15 22:17:25 470 1

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除