html5游戏开发马赛克对比,基于HTML5 Canvas的纯JS图片马赛克效果插件

这是一款基于HTML5 canvas的图片马赛克js插件。该图片马赛克插件使用简单，可调整马赛克的大小，透明度等属性，适合用于制作一些特殊的图片效果。

基于HTML5 Canvas的纯JS图片马赛克效果

该马赛克插件可用的配置参数有

参数默认值描述

image null 必选参数，图片元素的选择器

targetElement null 必选参数，目标元素的选择器

tileWidth 5 组成马赛克div元素的宽度，单位像素

tileHeight 5 组成马赛克div元素的高度，单位像素

tileShape 'circle' 马赛克的形状，可以为：circle 或 rectangle

opacity 1 马赛克图片的透明度

width null 必选参数，马赛克图片的宽度

height null 必选参数，马赛克图片的高度

该插件参数的使用方法参考如下varphotomosaic = newPhotoMosaic({ image : document.getElementById('image'), targetElement : document.getElementById('target'), width : 500, height : 500, tileHeight : 16, tileWidth : 16, tileShape : 'rectangle', opacity : 0.5})

html5游戏开发马赛克对比,基于HTML5 Canvas的纯JS图片马赛克效果插件相关推荐

HTML5游戏开发 PDF扫描版
很多从事Web前端开发的人对HTML总有些不满,比如需要手动检查和设计很多格式代码,不仅容易出错,而且存在大量重复.好在HTML5让我们看到了曙光.作为下一代Web开发标准,HTML5成为主流的日子已 ...
【Canvas】HTML5游戏开发的基本流程+P2.js物理引擎实战开发
<HTML5游戏开发的基本流程> * 1. HTML5的简述 * 2. HTML5游戏开发所需的环境与工具 * 2.1. 开发环境 * 2.1.1. 浏览器 * 2.1.2. 开发语言 * ...
业界技术大牛答：html5游戏开发前景如何？
编者按:作为2014年游戏业界现象级事件之一,<围住神经猫>的蹿红也为Egret(白鹭)这款游戏引擎博来了关注.Egret(白鹭)是一款可以一次开发,分别部署在Android.IOS和WP ...
CutJS – 用于 HTML5 游戏开发的 2D 渲染引擎
CutJS 是轻量级的,快速的,基于 Canvas 开发的 HTML5 2D 渲染引擎,可以用于游戏开发.它是开源的,跨平台的,与现代的浏览器和移动设备兼容.CutJS 提供了一个类似 DOM 树的 ...
HTML5游戏开发系列教程5(译)
原文地址:http://www.script-tutorials.com/html5-game-development-lesson-5/ 最终我决定准备下一篇游戏开发系列的文章,我们将继续使用can ...
HTML5 游戏开发快速提升
小册介绍 HTML5 是构建 Web 内容的一种语言描述方式,是最新的 HTML 标准,是构建以及呈现互联网内容的一种语言方式．被认为是互联网的核心技术之一.HTML5 是跨平台的,被设计为在不同类型 ...
HTML5游戏开发案例教程
学习本套HTML5游戏案例开发教程需要您有一定的HTML5.JS基础,如果您还没有学过HTML5和JS请您查看本店相关教程.如果您已经具备一定的开发基础,这些教程将有助于您快速入门HTML5游戏开发. ...
HTML5游戏开发–第10课
HTML5 Game Development – Lesson 10 Finally we can continue the series of articles on game developmen ...
html5游戏开发_HTML5游戏开发–第10课
html5游戏开发 HTML5 Game Development – Lesson 10 Finally we can continue the series of articles on game ...

html5游戏开发马赛克对比,基于HTML5 Canvas的纯JS图片马赛克效果插件

html5游戏开发马赛克对比,基于HTML5 Canvas的纯JS图片马赛克效果插件相关推荐

最新文章

热门文章