<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus®">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<title>Document</title>
</head>
<body onload="draw()">
<canvas id="canvas" width="500" height="500"></canvas>
</body>
<script>
function draw(){
var canvas=document.getElementById("canvas");
if(canvas==null)
{return false;}

var context=canvas.getContext("2d");

context.fillStyle="#eeeeef";
context.fillRect(0,0,500,500);
context.translate(200,50);
context.fillStyle="rgba(255,0,0,0.25)";
for(var i=0;i<50;i++)
{
context.translate(25,25);
context.scale(0.95,0.95);
context.rotate(Math.PI/10);
context.fillRect(0,0,100,50);
}
//g1=context.createRadialGradient(0,0,20,200,200,80);
//g1.addColorStop(0,"rgb(255,255,0)");
// g1.addColorStop(0.3,"rgb(234,67,98)");
//g1.addColorStop(1,"rgb(89,67,98)");
//context.fillStyle=g1;
//context.fillRect(0,0,300,300);
}
</script>
</html>

canvas-画蜗牛的更多相关文章

  1. 使用javascript和canvas画月半弯

    使用javascript和canvas画月半弯,月半弯好浪漫!浏览器须支持html5 查看效果:http://keleyi.com/a/bjad/8xqdm0r2.htm 以下是代码: <!do ...

  2. canvas 画圈 demo

    html代码: <canvas id="clickCanvas2"  width="180" height="180" data-to ...

  3. 踩个猴尾不容易啊 Canvas画个猴子

    踩个猴尾不容易啊  Canvas画个猴子 <!DOCTYPE html> <html> <head> <meta charset="UTF-8&qu ...

  4. canvas画随机闪烁的星星

    canvas画一颗星星: 规则的星星有内切圆和外切圆,每两个点之间的角度是固定的,因此可得到星星的每个点的坐标,画出星星. function drawStars(x,y,radius1,radius2 ...

  5. 用sass画蜗牛

    一.sass的好处 用css画图也算是简单的实战吧,虽然用到的东西还比较少..用过之后,发现sass主要有以下优势: 可维护性.最重要的一点,可维护性的很大一部分来自变量 嗯,最简单的例子,画图总要有 ...

  6. canvas画时钟

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http ...

  7. Canvas画椭圆的方法

    虽然标题是画椭圆,但是我们先来说说Canvas中的圆 相信大家对于Canvas画圆都不陌生   oGC.arc(400, 300, 100, 0, 2*Math.PI, false); 如上所示,直接 ...

  8. 深夜，用canvas画一个时钟

    深夜,用canvas画一个时钟 查看demo 这几天准备阿里巴巴的笔试,可以说已经是心力交瘁,自从阿里和蘑菇街的内推被刷掉之后,开始越来越怀疑起自己的能力来,虽然这点打击应该是微不足道的.毕竟校招在刚 ...

  9. 樱花的季节，教大家用canvas画出飞舞的樱花树

    又到了樱花的季节,教大家使用canvas画出飞舞的樱花树效果. 废话少说,先看效果. 演示效果地址:http://suohb.com/work/tree4.htm 查看演示效果 第一步,我们先画出一棵 ...

  10. HTML5之Canvas画圆形

    HTML5之Canvas画圆形 1.设计源码 <!DOCTYPE html> <head> <meta charset="utf-8" /> & ...

随机推荐

  1. Linux误删C基本运行库libc.so.6急救方法

    首先普及一下关于libc.so.6的基本常识: libc.so.6是glibc的软链接 ll  /lib64/libc.so.6lrwxrwxrwx 1 root root 11 Aug 27 201 ...

  2. Terminating app due to uncaught exception 'NSUnknownKeyException', reason: xxxx

    出现错误的情景: 使用Swift自定义Cell, 然后将这个Cell在OC中使用, 由于为了能够在OC中使用和使用起来命名比较规范 我在Swift自定义的Cell前加了 @objc(DSProduct ...

  3. PHP 错误处理

    PHP 错误处理 在 PHP 中,默认的错误处理很简单.一条错误消息会被发送到浏览器,这条消息带有文件名.行号以及描述错误的消息. PHP 错误处理 在创建脚本和 Web 应用程序时,错误处理是一个重 ...

  4. memmove 的实现

    baidu的笔试题目 用C语言实现一个公用库函数void * memmove(void *dest,const void *src,size_t n).该函数的功能是拷贝src所指的内存内容前n个字节 ...

  5. vim学习心得（一）——Cygwin下vim配置

    关于Vi有很多传说.其中最为著名的是: “Vi是编辑器之神,Emacs是神的编辑器” Emacs没有用过,但是Vi在Linux经常使用,所以,掌握好vi非常重要!!! Vim(Vi Improved) ...

  6. Jenkins修改域认证，非域用户忘记密码处理

    一.认证域地址修改 1. 编辑配置文件 vi $JENKINS_HOME/jenkins/config.xml 2.修改如下内容: <securityRealm class="huds ...

  7. Hibernate 缓存机制(转)

    一.why(为什么要用Hibernate缓存?) Hibernate是一个持久层框架,经常访问物理数据库. 为了降低应用程序对物理数据源访问的频次,从而提高应用程序的运行性能. 缓存内的数据是对物理数 ...

  8. Matlab与外部接口：MAT文件基础

    MAT 文件MAT文件是MATLAB使用的一种特有的二进制数据文件.MAT文件可以包含一个或者多个MATLAB 变量.MATLAB通常采用MAT文件把工作空间的变量存储在磁盘里,在MAT文件中不仅保存 ...

  9. Google地图

    Google地图开发总结 我们经常使用地图查位置.看公交.看街景,同时地图还开放第三方的API给开发者.利用这些API进行地图的个性化的展示和控制,例如北京被水淹了,开发一个网页显示北京被淹的地图,地 ...

  10. web安全：xss && csrf

    首先在user.php文件中去除黑名单的第一行标签,在白名单中添加<script>E1:csrf攻击zoobarcsrf:cross-site request forgery    跨站伪 ...