这儿介绍canvas的ccreatePattern函数,

context.createPattern(Image,"repeat"),还可以repeat-x,reapter-y

还可以context.createPattern(vedio,"repeat");

context.createPattern(canvas,"repeat");

var image=new Image();

image.src="a.jpg";

image.onload=function(){

  //var pattern=context.createPattern(image,"repeat");

  var canvas=createbackgroundCanvas();

  var pattern=context.createPattern(canvas,"repeat");

  context.fillStyle=pattern;

  context.fillRect(0,0,800,800);

  

}

function createbackgroundCanvas()

{

........

}

当然,以上所说的除了适用于fillStyle,还适用于strokeStyle

canvas 背景填充的更多相关文章

  1. HTML5 Canvas 颜色填充学习

    ---恢复内容开始--- 如果我们想要给图形上色,有两个重要的属性可以做到:fillStyle 和 strokeStyle. fillStyle = color strokeStyle = color ...

  2. canvas背景透明

    var can=document.getElementById("canv"); c=can.getContext("2d"); c.globalAlpha=. ...

  3. HTML5 Canvas渐进填充与透明

    详细解释HTML5 Canvas中渐进填充的参数设置与使用,Canvas中透明度的设置与使 用,结合渐进填充与透明度支持,实现图像的Mask效果. 一:渐进填充(Gradient Fill) Canv ...

  4. HTML5 Canvas ( 图片填充样式 ) fillStyle, createPattern

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  5. HTML连载32-背景颜色、背景图片、背景填充

    一.背景 1.如何设置标签的背景颜色 (1)在CSS中有一个background-color:属性值:,就是专门用来设置标签的背景颜色. (2)取值:具体单词.RGB.RGBA.十六进制 例子: &l ...

  6. 图形处理:给 Canvas 文本填充线性渐变

    作者:凹凸曼 - Barrior 在 Canvas 中对文本填充水平或垂直的线性渐变可以轻易实现,而带角度的渐变就复杂很多:就好像下面这样,假设文本矩形宽为 W, 高为 H, 左上角坐标为 X, Y. ...

  7. Cocos Creator (webgl模式下怎么让canvas背景透明)

    项目中构建出web-mobile包后,打开main.js 在main.js中加入如下两行即可让canvas变透明 cc.director.setClearColor(new cc.Color(0,0, ...

  8. canvas背景动画

    偶然反驳可看到博客背景的炫酷效果  觉得很新奇就去查看了一下源码  结果在git上找到了  记录一下 https://github.com/hustcc/canvas-nest.js/

  9. canvas背景

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

随机推荐

  1. 图论(网络流):[HNOI 2013]切糕

    [HNOI 2013]切糕 第三题:切糕(程序文件名:cake.exe)100 分,运行时限:5s 经过千辛万苦小A 得到了一块切糕,切糕的形状是长方体,小A 打算拦腰将切糕切成两半分给小B.出于美观 ...

  2. java编码问题深入总结

      Java语言能够这么普遍的应用,与其国际化的能力是 分不开的,国际化的编码是Java国际化中最重要的一个组成部分,Java的国际化编码能力与其使用Unicode编码是直接相关的.在Java中,任何 ...

  3. 我的学习笔记之node----node.js+socket.io实时聊天(2)

    废话不多说,直接贴代码吧.注释很详细了. 服务端代码: /** * Created by LZX on 2015/10/7. */(function () { var d = document, w ...

  4. redis学习心得之三-【java操作redis】

    今天主要是讲讲java对redis的操作,来段代码掩饰下基本操作即可明白. java调用你需要下载jedis.jar包 下载网址:https://github.com/xetorthio/jedis/ ...

  5. msyql 字节问题

    MySQL 数据库的varchar类型在4.1以下的版本中的最大长度限制为255,其数据范围可以是0~255或1~255(根据不同版本数据库来定).在 MySQL5.0以上的版本中,varchar数据 ...

  6. UNIX编程之冲洗内存流与null追加策略(APUE F5-15)

    博文链接:http://haoyuanliu.github.io/2016/04/29/mysql/ 对,我是来骗访问量的!O(∩_∩)O~~ 最近一直在拜读APUE(Advanced Program ...

  7. java自定义对话框

    package com.matp.view; import java.awt.FlowLayout; public class SimpleDialog extends JDialog impleme ...

  8. DM8168 坎坷硬件之路(DDR3)

    新做了8168板,调试DDR3的时候EMIF0遇到了个别数据位出错的问题 DDR3 128MB*8=1GB 我为了測试DDR3的所有空间,把地址存到DDR3中,就是*pdata++=(Uint32)p ...

  9. Qt 学习之路 :进程间通信

    上一章我们了解了有关进程的基本知识.我们将进程理解为相互独立的正在运行的程序.由于二者是相互独立的,就存在交互的可能性,也就是我们所说的进程间通信(Inter-Process Communicatio ...

  10. css3之 media query 使用(转)

    原文链接:http://www.moke8.com/article-5657-1.html 讲到响应式布局, 相信大家都有一定的了解,响应式布局是今年很流行的一个设计理念,随着移动互联网的盛行,为解决 ...