html5 烟雾,jQuery烟雾背景发生器(HTML5 Canvas插件waterpipe.js

0b9473093c51c7bf1b6aa5c2795310e7.png

c714816320c3c7678952c0af200e40b9.png

插件描述:waterpipe.js是一个创建烟雾弥漫的背景,有多种效果可选择,自定义参数效果还是挺酷的哦!

使用方法

1、包括jQuery和waterpipe.js

2、创建画布元素内包装

Your browser does not support HTML5 canvas.

3、创建画布元素内包装var smokyBG = $('#wavybg-wrapper').waterpipe({

//Default values

gradientStart: '#000000',

gradientEnd: '#222222',

smokeOpacity: 0.1,

numCircles: 1,

maxMaxRad: 'auto',

minMaxRad: 'auto',

minRadFactor: 0,

iterations: 8,

drawsPerFrame: 10,

lineWidth: 2,

speed: 1,

bgColorInner: "#ffffff",

bgColorOuter: "#666666"

});

选项

选择类型        默认值

gradientStartstring'#000000'开始颜色的十六进制格式。

gradientEndstring'#222222'渐变结束色十六进制格式。

smokeOpacitynumber0.10.1号烟度0至1。.

numCirclesint1Number of circles (smokes).

maxMaxRadint or 'auto''auto'可以用来改变圆半径的大小

minMaxRadint or 'auto''auto'可以用来改变圆半径的大小

minRadFactorint0表示相对于最大可能的最小半径大小。从0到1的整数。

iterationsint8The number of subdividing steps to take when creating a single fractal curve. Can use more, but anything over 10 (thus 1024 points) is overkill for a moderately sized canvas.

drawsPerFrameint10Number of curves to draw on every tick of the timer

lineWidthnumber2Line width

speedint1Drawing speed (tick of timer in ms)

bgColorInnerstring'#ffffff'背景外观颜色的十六进制格式

bgColorOuterstring'#666666'背景内颜色的十六进制格式

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/513762.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

数据仓库分层存储技术揭秘

简介: 本文介绍数据仓库产品作为企业中数据存储和管理的基础设施,在通过分层存储技术来降低企业存储成本时的关键问题和核心技术。 作者 | 沄浩、士远 来源 | 阿里技术公众号 一 背景 据IDC发布的《数据时代2025》报告显示,全球每年产生的数…

cups支持的打印机列表_网络存储让你的打印机瞬间变无线,打印文件不用愁

无论是公司的文件、合同还是学校的教材作业总有需要打印的而且还需要满足手机、电脑等设备的无线打印不然文件来回拷贝实在是太麻烦了只要打印机搭配群晖NAS旧打印机也能上岗再就业轻松实现无线打印!话不多说,这就开始教大家如何使用!先确认一…

python同时输出多个值_怎样在python中输出多个数组元素?

展开全部 如果2113要输出多个列表元素,实际上是列表的分片5261或者说是切片。 以下代码运4102行通过:12list [a, b, mpilgrim, z, example]print(\n, list[0:3]) 运行效1653果:1.python输出一维矩阵或numpy数组中的非0元素 import numpy as …

网游云上网络优化方案

简介: 网游云上网络优化方案1. 游戏行业背景 1.1 行业概况 2019全球数字游戏营收1094亿美元,其中中国市场328亿美元。国内游戏⽤户数6.5亿;移动端 (60%)>PC端>主机。移动游戏占⽐逐年增⻓已成为绝对的主流。国内公司近3万,近…

云栖大会展出两款一体机,搭载新一代无影融合架构

10月18日云栖大会开放日上,阿里云基于新一代无影架构的两款一体机已对观众展出。两款新品分为23.8寸标准版和27寸Pro版,Pro版为手绘场景配有触控屏和触控笔,官方介绍为首款设计师云电脑。 在云栖大会展区,观众已经可以对一体机进…

ansys如何删除线_绘画新手不懂如何用ps提取线稿?教你用PS提取自己喜欢的线稿!...

绘画新手不懂如何用ps提取线稿?初学者如何自学绘画?自学板画难吗?怎样才能学习好绘画?想必这些都是绘画初学者们经常在想的问题吧,就是不知道如何才能学习好绘画,然后绘画出自己想要画的东西那么今天灵猫课…

Service Mesh 从“趋势”走向“无聊”

简介: 过去一年,阿里巴巴在 Service Mesh 的探索道路上依旧扎实前行,这种坚定并非只因坚信 Service Mesh 未来一定是云计算基础技术的关键组成部分,还因需要借这一技术趋势去偿还过去所积累下来的技术债(“技术债”并非…

python增加一列数据_python数据怎么添加列?

python在DataFrame数据中添加列的方法: 1、使用concat方法在数据中添加列 concat方法相当于数据库中的全连接(union all),它不仅可以指定连接的方式(outer join或inner join)还可以指定按照某个轴进行连接。…

开源 1 年半 star 破 1.2 万的 Dapr 是如何在阿里落地的?

简介: Dapr 是 2019 年 10 月微软开源的可移植、事件驱动分布式运行时,它使开发人员能够轻松地构建运行在云平台和边缘的弹性而微服务化的无状态和有状态的应用程序,从而降低基于微服务架构构建现代云原生应用的准入门槛。 作者 | 敖小剑 来源…

cron 每年执行一次_crontab服务执行定时脚本,在指定时间内让php执行处理业务逻辑...

技小白 2019-12-19 11:45:33crontab-e编辑某个用户的cron服务设置执行脚本crontab-l列出某个用户cron服务列表信息crontab-r删除某个用户的cron服务定时任务crontab格式分小时日月星期命令******0-590-231-311-120-6command注:“*”代表取值范围内的数字“/”代表每…

Fluid 给数据弹性一双隐形的翅膀 -- 自定义弹性伸缩

简介: 弹性伸缩作为 Kubernetes 的核心能力之一,但它一直是围绕这无状态的应用负载展开。而 Fluid 提供了分布式缓存的弹性伸缩能力,可以灵活扩充和收缩数据缓存。 它基于 Runtime 提供了缓存空间、现有缓存比例等性能指标, 结合自身对于 Run…

ff14注册完服务器可以转,FF14怎么转服 FF14转服条件一览-游侠网

你知道FF14怎么转服吗?如果想要换服务器,都有哪些特别的要求呢?下面为大家带来的是FF14转服条件一览,大家一起来了解一下吧。转服条件一览跨区角色转移试行规则1、本次仅开放陆行鸟区转向莫古力区指定服务器功能。我们将在莫古力区…

业务团队如何统一架构设计风格?

简介: 首次上线应用,面对业务框架搭建你是否曾感到无从下手?维护线上应用,面对大量历史包袱你是否正避坑不及深陷泥潭?为何同样是业务应用,不同人的设计风格千差万别?为何最初的设计经过多个迭代…

一文详解物化视图改写

简介: 本文主要介绍什么是物化视图,以及如何实现基于物化视图的查询改写。 作者:阿里云数据库OLAP产品部 云曦 预计算和缓存是计算机领域提高性能以及降低成本的最常见的手段之一。对于那些经常重复的请求,如果可以通过缓存回答…

close_wait过多服务器无响应,记一次大量CLOSE_WAIT连接导致的服务宕机

最近线上服务出现了一段时间的无法响应,在此总结一下问题的排查过程。监控信息监控显示CPU和内存没有异常波动,TCP连接中有大量的CLOSE_WAIT状态的连接。看一下TCP连接断开的过程:也就是说客户端发起了断开连接的包,服务端收到数据…

【Java JVM】Java 实例对象的访问定位

Java 程序会通过栈上的 reference 数据来操作堆上的具体对象。 但是 reference 类型在《Java虚拟机规范》里面只规定了它是一个指向对象的引用, 并没有定义这个引用应该通过什么方式去定位, 访问到堆中对象的具体位置, 所以对象访问方式也是由虚拟机实现而定的,主流…

独家对话阿里云函数计算负责人不瞋:你所不知道的 Serverless

简介: 如果你是一名互联网研发人员,那么极有可能了解并应用过 Serverless 这套技术体系。纵观 Serverless 过去十年,它其实因云而生,也在同时改变云的计算方式。如果套用技术成熟度曲线来描述的话,那么它已经走过了萌芽…

nginx location 匹配 多个规则_三道小练习助你弄懂 Nginx location 匹配

在 Nginx 中我们可以通过配置 location 指令块,来决定一个请求 url 如何处理。如果我们编写了多条 location 指令块,如何保证各个 location 不会产生冲突?如何理清 location 的匹配顺序?带着这两个问题,我们先来做几道…

手机淘宝轻店业务 Serverless 研发模式升级实践

简介: 随着 Serverless 在业界各云平台落地,阿里内部 Serverless 研发平台、各种研发模式也在业务中逐步落地,如火如荼。在此契机下,淘系团队启动了轻店 Serverless 研发模式升级战役,基于阿里集团底层设施建设、上层技…

服务器 独立显卡 显示不出来,dell服务器R720+独立显卡GTX1650,进不去系统,UEIF报错...

戴尔服务器dell R720的显卡问题。操作系统是win2008R2。现在是安装的华硕750ti,运行ok,多个屏幕。买了技嘉gtx1650,刚出的显卡安装了。在集成显卡情况下打了驱动,设备管理显示识别了。但是切换到GTX1650显卡下启动系统&#xff0c…