web299.com
全部
教育
语言/资格考试
法律
互联网
政务民生
Word模板
Excel模板
PPT模板
网页特效
小程序模板
网站模板
首页
教育
语言/资格考试
法律
互联网
政务民生
Word模板
Excel模板
PPT模板
网页特效
小程序模板
网站模板
当前位置：
首页
>
网页特效
>
背景
HTML5 canvas圆形气泡动画背景插件
分类：
背景
日期：
2024-05-14
点击(0)
评论(0)
演 示
免费下载
简介
在页面中引入circleMagic.js文件。 ```html <script src="path/to/js/circleMagic.js"></script> ``` ##### HTML结构 如果要为网站的顶部banner制作气泡背景动画效果，例如使用一个header元素来作为容器。 ```html <header class="header"> <!-- banner内容 --> </header> ``` ##### 初始化插件 在页面DOM元素加载完毕之后，通过下面的方法来初始化circleMagic.js圆形气泡动画背景插件。 ```html $('.header').circleMagic({ elem: '.header', radius: 35, densety: .3, color: 'rgba(255,255,255, .4)', //color: 'random', clearOffset: .3 }); ``` ##### 配置参数 circleMagic.js圆形气泡动画背景插件的可用配置参数有： | 参数 | 描述 | | ------------ | ------------ | |elem|要应用圆形气泡动画背景效果的容器元素。| |radius|定义圆形的半径。| |densety|指定屏幕中显示圆形的密度。| |color|圆形气泡的颜色。可以是CSS颜色值或关键字random。| |clearOffset|定义消失的圆形气泡的数量。|
相关推荐
html5浪漫粒子表白文字特效
SlidesJS幻灯片特效
html5瀑布流相册特效
css3 svg实现的情人节表白鲜花动画特效
t-scroll.js基于ES6的DOM元素,过渡动画库插件
纯js写省市区三级联动效果
广告
广告
