代码改变世界

随笔分类 - HTML5

HTML5 Canvas 绘制时钟

2013-01-29 15:47 by VVG, 6474 阅读, 收藏, 编辑
摘要:demo演示:用到的一些绘制方法说明:context.translate(x,y)方法,重新设置画布的坐标源点,设置后,x,y坐标处为变为起始坐标(0,0);context.arc(圆心x坐标, 圆心Y坐标, 圆半径, 起始弧度,结束点弧度, 是否顺时针)方法绘制圆形,或者圆弧;context.rotate(弧度) 方法接受一个弧度制参数,旋转画布,然后绘制图形,相当于给绘制的图形旋转一个角度;context.save() 和context.restore() 方法,记录起始状态和回复状态context.fillRect(矩形左上角X坐标,Y坐标,宽度,高度): 绘制矩形context.fil 阅读全文

HTML5 canvas banner广告编辑插件,canvas画图实例

2012-12-01 14:49 by VVG, 3403 阅读, 收藏, 编辑
摘要:请用谷歌或则火狐浏览器浏览!DEMO演示:点击演示DEMO下载:点击下载利用HTML5 canvas中的canvas.toDataURL 可以对画布进行输出操作,可以利用这个特性做出图像的裁剪功能以前要做裁剪操作需要传递数据到后端,如PHP,利用相应的图像操作函数操作保存!现在使用HTML5方便多了截图演示:输出图片:关键代码:1、使用FileReader读取FILE表单文件Filereader有下面几种方法,预览图片用到的是readAsDataURL。方法名参数描述abortnone中断读取readAsBinaryStringfile将文件读取为二进制码readAsDataURLfile将文 阅读全文

让你的网站融入HTML5的元素[转]

2012-02-22 10:05 by VVG, 165 阅读, 收藏, 编辑
摘要:我们已经看过许多关于HTML 5的文章了,但是,对于Web开发人员来说,最主要需要知道的是:我现在可以用上HTML 5来做些什么,我怎么开始使用它?本文将带您了解如何在你的站点上使用HTML 5。 已经有许多文章是关于HTML 5的了,例如“HTML 5时代来临”和“HTML 5会如何改变网络”之类的,但是对于Web开发人员来说,最主要需要知道的是:我现在可以用上HTML 5来做些什么,我怎么开始使用它?好消息是现在已经有不少的HTML 5里的东西可以使用了。 但是,开始你就必须要明白一件事情,你需要知道你的受众如何,否则的话你就不该使用HTML 5。假如你的站点的访问大部分人都是在使... 阅读全文