![](https://img-blog.csdnimg.cn/20201014180756724.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
canvas
文章平均质量分 52
canvas随记
假程序员小一
努力配上程序员称号的菜鸟
展开
-
canvas实例之小球运动藕断丝连
源码加备注:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Doc.原创 2021-03-09 22:34:57 · 144 阅读 · 0 评论 -
Canvas详解(一)
Canvas概述Canvas:一个轻量级的画布,利用js代码在浏览器上画画,无需插件。文章目录Canvas概述一、基础概念1.标签2.兼容性3.绘制4.动画5.面向对象编程的动画二、详解Canvas的绘制功能1.绘制矩形1.1填充矩形1.2绘制矩形边框1.3清除画布2.绘制路径3.绘制圆弧总结一、基础概念1.标签属性只有俩:width、heigth。且width、heigth只能在标签<canvas></canvas>里设置,在css样式<style>原创 2021-02-21 22:38:11 · 1994 阅读 · 3 评论 -
Canvas实例之鼠标移动特效(彩色小球)
文章目录一、鼠标点击绽放彩色小球二、。。。一、鼠标点击绽放彩色小球图示:思路1、小球必要属性:圆心起始点xy,半径r,颜色color2、小球的事件:运动—>运动方向dx dy,触发—>鼠标触发3、canvas动画思想:清屏(清除画布)-更新(更新小球的运动)-渲染(创建小球)总结:什么位置什么时候画什么形状的小球源码与注释<body> <canvas id="mycanvas" width="800" height="500"></ca原创 2021-02-21 22:36:26 · 1090 阅读 · 1 评论