Canvas
关注
分享
扫一扫
少年无为
少年无为、青年有为。
展开
-
Canvas线性渐变时间显示（简单特效）
附图 原理 首先通过js获取当前系统时间并建立一个数组将获取到的时间中的时分秒解析出来保存在数组内； var time=new Date(); //time_a数组用于保存时分秒数据 var time_a =[time.getHours(),time.getMinutes(),time.getSeconds()]; 其次就是canvas作图操作了，先创建一个画布，对其进行线性渐变，字...原创 2018-08-14 09:36:37 · 3017 阅读 · 0 评论 -
Canvas时钟效果
先附上效果图。时钟会获取当前系统时间，并开始运行，下面是代码全部截图，欢迎canvas初学者学习使用，一定要静下心来多敲代码练习。 前端代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Canvas时钟&a原创 2018-08-12 21:59:32 · 303 阅读 · 0 评论 -
Canvas-太阳系
效果预览 前端代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>太阳系</title> <script src="js/jquery.js"原创 2018-08-12 22:25:21 · 2989 阅读 · 0 评论 -
Canvas-七夕爱心
七夕来临，最近正好在学习Canvas，所以做了一个七夕爱心，下面是演示图（转换的不清楚，不要太在意）。 下面放一张高清图： 特点： 1、会获取当前系统时间并在页面上显示。 2、跳动的小球是从白色爱心上一行一行跳动的，然后随机向右或向左运行，因为爱心是在左侧屏幕，所以看起来大部分小球都是向右跳动的。 3、优化了弹跳函数性能，避免小球过多吃内存问题，运行时可打开控制台查看小球数，程序...原创 2018-08-16 08:55:49 · 3363 阅读 · 0 评论