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

 <!DOCTYPE html>

 <html lang="zh-cn">

 <head>

     <meta charset="UTF-8">

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

 </head>

 <style type="text/css">

 </style>

 <body>

     <canvas id="canvas" width="800" height="600" style="background: #A9A9A9">

             很抱歉，您的浏览器暂不支持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;

         function rotRect(){

             i++

             ctx.save()

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

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

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

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

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

             ctx.restore()

         }

         setInterval('rotRect()',500)

     </script>

 </body>

 </html>

8-12 canvas专题-阶段练习一（上）的更多相关文章

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

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

  2. 8-23 canvas专题

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

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

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

  4. Canvas在移动端设备上模糊出现锯齿边

    在绘制的过程中画布内容的实际大小是根据 canvas 的 width 与 height 属性设置的,而 style 或者CSS设置的width 与 height 只是简单的对画布进行缩放. canva ...

  5. Java基础知识强化之网络编程笔记12：TCP之TCP协议上传文本文件并给出反馈

    1. 客户端: package cn.itcast_12; import java.io.BufferedReader; import java.io.BufferedWriter; import j ...

  6. HTML5 Canvas前台压缩图片并上传到服务器

    1.前台代码: <input id="fileOne" type="file" /> <input id="btnOne" ...

  7. 玩转html5（二）----用canvas结合脚本在画布上画简单的图（html5又一强大功能）

    在html5中可以使用canvas标签在画布上画图,先直接上代码,这篇文章先简单介绍一下canvas的使用方法,简单画几个圆,矩形,三角形,写字. 在代码中均给出了注释,在这里特别强调的一点是:使用c ...

  8. Vue directive自定义指令+canvas实现H5图片压缩上传-Base64格式

    前言 最近优化项目-手机拍照图片太大,回显速度比较慢,使用了vue的自定义指令实现H5压缩上传base64格式的图片 canvas自定义指令 Vue.directive("canvas&qu ...

  9. [WCF编程]12.事务：服务事务编程(上)

    一.设置环境事务 默认情况下,服务类和操作没有环境事务,即使客户端事务传播到服务端也是如此. 尽管强制事务流从客户端传播过来,但服务端的环境事务依旧为null.为了启用环境事务,每个操作必须告诉WCF ...

随机推荐

  1. [Python3网络爬虫开发实战] 3.1-使用urllib

    在Python 2中,有urllib和urllib2两个库来实现请求的发送.而在Python 3中,已经不存在urllib2这个库了,统一为urllib,其官方文档链接为:https://docs.p ...

  2. jmeter 接口测试

    web接口测试工具: 手工测试的话可以用postman ,自动化测试多是用到 Jmeter(开源).soupUI(开源&商业版). 下面将对前一篇Postman做接口测试中的接口用Jmeter ...

  3. PS学习笔记（05）

    PS学习笔记(09) [2]马赛克背景 找一张图片.然后新建图层,让前景色背景色恢复到默认的状态(黑.白) 在新建图层上填充黑色-->滤镜-->渲染->云彩 像素化-->马赛克 ...

  4. 《C语言程序设计（第四版）》阅读心得（三）

    第八章  指针 1.一个变量的地址称为该变量的指针 一个专门用来存放另一变量的地址(即指针),称它为指针变量.指针变量的值是指针(即地址) 如上图2000是变量的指针,pointer是指针变量, 赋值 ...

  5. 【莫比乌斯反演+树状数组+分块求和】GCD Array

    https://www.bnuoj.com/v3/contest_show.php?cid=9149#problem/I [题意] 给定长度为l的一个数组,初始值为0:规定了两种操作: [思路] 找到 ...

  6. android开发里跳过的坑-AS导入NDK工程提示错误 No such property: sdkHandler for class: com.android.build.gradle.LibraryPlugin

    接到一个NDK工程需要调试,导入后发现总是提示错误 Error:(37, 1) A problem occurred evaluating project ':libuvccamera'.> N ...

  7. NOIP2018普及游记

    我好弱啊,今年又是考pj啊 今年GD的又是在我们学校有考点(gzez) 考前其实还是蛮紧张的,毕竟考砸了就AFO了.我dp是真的弱,模拟赛连最长下降子序列都不会写,心想要是T3是dp就咕咕咕了.去年那 ...

  8. cdq分治入门--BZOJ1176: [Balkan2007]Mokia

    对w*w,w<=2000000的矩形,一开始全是0(或一开始全是s),n<=170000个操作,每次操作:矩阵内某点加上一个数,查某一个子矩阵的和,保证修改数<=160000,询问数 ...

  9. Form表单的action和onSubmit示例介绍

    action是form的属性,onSubmit为事件,要说执行的先后顺序,个人理解是onSubmit在先. 第一:action是form的属性,html5已经将其定义为必需的属性值,onSubmit为 ...

  10. [bzoj3489]A simple rmq problem_KD-Tree

    A simple rmq problem 题目大意:给定一个长度为$n$的序列,给出$m$个询问:在$[l,r]$之间找到一个在这个区间里只出现过一次的最大的数. 注释:$1\le n\le 10^5 ...