8-13 canvas专题-阶段练习二（下)

 <!DOCTYPE html>

 <html lang="zh-cn">

 <head>

     <meta charset="UTF-8">

     <title>8-13 课堂演示</title>

 </head>

 <style type="text/css">

 </style>

 <body>

     <canvas id="canvas" width="800" height="600" >

             很抱歉，您的浏览器暂不支持HTML5的canvas

     </canvas>

     <script>

         var c=document.getElementById("canvas");

         var ctx=c.getContext("2d");

         ctx.lineWidth=5;

         ctx.strokeStyle="orange";

         ctx.fillStyle="red";

         var i=0;

         var j=100;

         var step=-1;

         function rotRect(){

             i++

             if(j==200){

                 step=-1

             }else if(j==1){

                 step=1

             }

             j+=step;

             ctx.save()

             ctx.clearRect(0,0,c.width,c.height)

             ctx.scale(j/100,j/100);

             ctx.translate(c.width/2,c.height/2);

             ctx.rotate(i*15*Math.PI/180)

             ctx.translate(-50,-50);

             ctx.strokeRect(0,0,100,100)

             ctx.fillRect(0,0,100,100)

             ctx.restore()

         }

         setInterval('rotRect()',10)

     </script>

 </body>

 </html>

8-13 canvas专题-阶段练习二（下)的更多相关文章

  1. 8-12 canvas专题-阶段练习一（上）

    8-12 canvas专题-阶段练习一(上) <!DOCTYPE html> <html lang="zh-cn"> <head> <me ...

  2. 8-23 canvas专题

    8-23 canvas专题-了解外部框架的使用 学习要点 掌握画布内容的导出的toDataURL()方法 了解外部框架的使用 第八章内容介绍 在第八章中我们将对以前的知识进行简单的回顾,着重对canv ...

  3. Leetcode之二分法专题-240. 搜索二维矩阵 II（Search a 2D Matrix II）

    Leetcode之二分法专题-240. 搜索二维矩阵 II(Search a 2D Matrix II) 编写一个高效的算法来搜索 m x n 矩阵 matrix 中的一个目标值 target.该矩阵 ...

  4. 8-15 globalCompositeOperation阶段练习二

    8-15 globalCompositeOperation阶段练习二 <!DOCTYPE html> <html lang="zh-cn"> <hea ...

  5. 8-2 canvas专题-线条样式

    8-2 canvas专题-线条样式 学习要点 对第五章知识进行简单的回顾和总结 进一步讲解canvas绘图相关的知识点 第八章内容介绍 在第八章中我们将对以前的知识进行简单的回顾,着重对canvas绘 ...

  6. Element Vue 开箱即用框架如何使用-测试开发【提测平台】阶段小结(二)

    微信搜索[大奇测试开],关注这个坚持分享测试开发干货的家伙. 上一篇总结了后端服务接口的开发,这篇我们主要来总结下前后端分离开发中的前端部分,主要是开箱即用的框架介绍和之前章节组件的梳理和部分的扩展内 ...

  7. 【微服务专题之】.Net6下集成消息队列上-RabbitMQ

    ​ 微信公众号:趣编程ACE关注可了解更多的.NET日常实战开发技巧,如需源码 请公众号后台留言 源码;[如果觉得本公众号对您有帮助,欢迎关注] .Net中RabbitMQ的使用 [微服务专题之].N ...

  8. Bootstrap <基础十二>下拉菜单（Dropdowns）

    Bootstrap 下拉菜单.下拉菜单是可切换的,是以列表格式显示链接的上下文菜单.这可以通过与 下拉菜单(Dropdown) JavaScript 插件 的互动来实现. 如需使用下列菜单,只需要在 ...

  9. 此文记录了我从研二下学期到研三上学期的找工历程，包括百度、腾讯、网易、移动、电信、华为、中兴、IBM八家企业的面试总结和心得--转

    感谢电子通讯工程的研究生学长为大家整理了这么全面的求职总结,希望进入通信公司和互联网公司做非技术类岗位的学弟学妹们千万不要错过哦~ ---------------------------原文分割线-- ...

随机推荐

  1. Yii 2.0 query模式语法

    项目使用Yii 2.0版本开发,个人一直喜好使用(new \yii\db\Query())模式操作数据,把增.删.查.改这4种情况的写法整理出来,方便查阅和记忆. 增加 - insert use Yi ...

  2. 配置Django中数据库读写分离

    django在进行数据库操作的时候,读取数据与写数据(曾.删.改)可以分别从不同的数据库进行操作 修改配置文件: DATABASES = { 'default': { 'ENGINE': 'djang ...

  3. Hadoop-2.7.1伪分布--安装配置hbase 1.1.2

    hbase-1.1.2下载地址:http://www.eu.apache.org/dist/hbase/stable/hbase-1.1.2-bin.tar.gz 下载之后解压至\usr\local目 ...

  4. C51 原创电子琴 （蜂鸣器/计时器/中断/矩阵按键）

    需求分析 用C51的16个矩阵按键当作两个八度的琴键 按下时发出相应音调的声音,静态数码管显示相应音符的数字. 为了解锁更多曲目,两个多的琴键设计成#4,显示时加上小数点 下图分别为1和#4的显示,其 ...

  5. python 中文转码 Excel读csv

    大家都知道Excel读csv用的是ascii编码,我认为,ascii没有中文,所以这里指的应该是utf-8. 我遇到的问题是这样的,unity项目只能用txt文件,有一堆数据表用txt的文档保存下来了 ...

  6. input输入框的readonly属性-----http://www.w3school.com.cn/tags/tag_input.asp

    http://www.w3school.com.cn/tags/tag_input.asp input输入框的readonly属性 查询方法: 1.先找官方的文档,api 2.官方的有看不懂的再百度相 ...

  7. 2015 湘潭大学程序设计比赛（Internet）部分题解，其中有一个题与NYOJ1057很像，贪心过~~

    仙剑奇侠传                 祝玩的开心                                                                          ...

  8. MySQL最优配置文件模板·2016-11-28

    小伙伴们大爱的MySQL最优配置文件模板更新啦.对之前的MySQL最优配置文件·20160901做了一些修正,更为名至实归.可以通过此链接进行下载.当然,更欢迎同学们提出意见和建议,共同打造一个最优M ...

  9. Node.js & module system

    Node.js & module system Node.js v10.9.0 Documentation https://nodejs.org/api/modules.html#module ...

  10. [luoguP1472] 奶牛家谱 Cow Pedigrees（DP）

    传送门 一个深度为i的树可以由一个根节点外加两个深度为i-1的树组成,这就决定了DP该怎么写. 然而我真的没有想到. f[i][j]表示深度为i节点数为j的个数 sum[i][j]表示深度小于等于i节 ...