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. 全国高校绿色计算大赛 预赛第二阶段（Python）

    第1关统计分数的麻烦 class Task: def get_lost_scores(self, scores): s = "" index = [1 for i in range ...

  2. 2018湖南省第14届大学生计算机程序设计竞赛 D: 卖萌表情

    Description 已知以下 4 种都是卖萌表情(空白的部分可以是任意字符.竖线是便于展示的分隔符,没有实际意义): ^ ^ | ^ | < | > v | v v | > | ...

  3. 关于Django中，实现序列化的几种不同方法

    前言 关于序列化操作,就是将一个可迭代的数据结构,通过便利的方式进行我们所需要的操作. 今天历来归纳一下,Django中的几种不同得分方法,已经Django-restframework提供的方法 创建 ...

  4. 【06】对AJAX的总结(转)

    对AJAX的总结   通过前面对 AJAX 的讲解,我们可以将 AJAX 请求分成以下几个步骤: 创建 XMLHttpRequest 对象: 设置事件处理函数,处理返回的数据: 初始化并发送请求. 可 ...

  5. PS一些技巧

    色阶的解决办法 我们做效果图的时候经常会使用大面积渐变,时常会出现比较严重的色阶问题,通常出现这些明显色阶的时候,可以通过使用高斯模糊对色阶进行模糊化处理. 在使用PS CC的过程中,笔者经常遇到假死 ...

  6. 经典算法入门 列表C/C++

    排序:插入排序.选择排序.冒泡排序.归并排序.快速排序.基数排序.计数排序.桶排序 查找:二分查找 树:先根.中根.后跟遍历 图:深度优先.广度优先.最小生成树.单元最短路径.全成对最短路径 动态规划 ...

  7. Android OkHttp与物理存储介质缓存：DiskLruCache（2）

     Android OkHttp与物理存储介质缓存:DiskLruCache(2) 本文在附录文章8,9的基础之上,把Android OkHttp与DiskLruCache相结合,综合此两项技术,实 ...

  8. [luoguP2709] 小B的询问（莫队）

    传送门 个数 1 2 3 4 5 答案 1 4 9  16 25 做差 1 3 5 7 9 显然增加一个数只需要增加 ton[a[x]] << 1 | 1 即可 减去一个数也减去这个 注意 ...

  9. Flask组件：flask-sqlalchemy & flask-script & flask-migrate

    flask-sqlalchemy组件 项目目录结构: flask目录 # 项目名 |--- flaskdir |--- static # 静态文件 |--- templates # 模板 |--- m ...

  10. [K/3Cloud] 使用操作还是服务

    现在菜单点击事件既可以挂操作又可以挂服务,那到底是应该挂操作还是服务呢? 有个需求是要求一个动作可以在两个时点被触发 1.单据由下推或选单生成的时候: 2.点击单据界面功能菜单: 这样是不是需要做一个 ...