摘要: 话不多说直接上代码 因为项目需求,该动画中需要显示即时更新的数据,所以和普通的canvas画出来的不一样。但是又不能直接把html画到canvas中去,别着急有办法。 为了绘制 HTML 内容,你要先用<foreignObject> 元素包含 HTML 内容,然后再将这个 SVG 图像绘制到你的 c 阅读全文
posted @ 2018-08-14 17:32 紫菜、 阅读(468) 评论(0) 推荐(0) 编辑
摘要: 创建画布,验证浏览器兼容性我就省去了,也很简单网上有代码。 然就是蛇对象 食物 移动 控制方向 吃到食物 吃到自己 基本功能大概就是这样。可能还不算完美,后面有时间继续优化一下! 阅读全文
posted @ 2017-09-08 10:56 紫菜、 阅读(449) 评论(2) 推荐(2) 编辑
摘要: 首先第一步。 然后 函数体内容: 1).每次调用前清除一次画布,所以放在第一行。 2).绘制时钟的外边框和圆心,很容易就不解释了。 3).绘制小时和分钟的刻度。 4).绘制小时数 5).最后绘制时分秒指针 阅读全文
posted @ 2017-09-05 15:44 紫菜、 阅读(287) 评论(0) 推荐(0) 编辑
摘要: var csns=document.getElementById("csns"); var tcx=csns.getContext("2d"); csns.style.border="1px red solid"; tcx.strokeStyle="#1296DB" tcx.beginPath(); tcx.moveTo(95,50); t... 阅读全文
posted @ 2017-08-29 13:19 紫菜、 阅读(728) 评论(0) 推荐(1) 编辑
摘要: 1 var raf; 2 var arror = []; 3 var running = false; 4 //绘制圆形 5 function createBall() { 6 return { 7 x: 0, 8 y: 0, 9 vx: 10-Mat... 阅读全文
posted @ 2017-08-16 17:15 紫菜、 阅读(360) 评论(0) 推荐(2) 编辑
摘要: 样子有点戳,别见怪!O(∩_∩)O哈哈~ 阅读全文
posted @ 2016-06-17 16:14 紫菜、 阅读(566) 评论(0) 推荐(0) 编辑
摘要: 今天比较闲所以就花点时间又写了点东西。 相信这种价格表大家不会陌生 现在我就模仿它做一个简单版本的。效果如下 首先需要两个时间控件,我这里用的是HTML5里面的时间控件,这个没限制喜欢用什么就用什么 直接上代码吧!我都写了注释。 阅读全文
posted @ 2016-05-31 16:26 紫菜、 阅读(2236) 评论(1) 推荐(0) 编辑
摘要: 说说我自己的思路 首先需要一个初始div 然后就是鼠标事件,想象一下拖动这个过程需要用到哪些事件。。。 1、鼠标按钮按下事件mousedown 2、鼠标按钮松开事件mouseup 3、鼠标移动事件mousemove 第一步:给div添加鼠标按钮按下事件,这个事件需要完成以下事情 一、获取div到浏览 阅读全文
posted @ 2016-05-31 14:45 紫菜、 阅读(284) 评论(1) 推荐(0) 编辑