HTML5SVG彩色斑点缓缓落下背景动画特效.zip资源-CSDN文库

共6个文件

js：4个

html：1个

css：1个

版权申诉

特效代码

jquery插件

jquery特效

171 浏览量 2023-09-26 01:42:57 上传评论收藏 96KB ZIP 举报

资源推荐

资源详情

资源评论

收起资源包目录

HTML5 SVG彩色斑点缓缓落下背景动画特效.zip （6个子文件）

randomColor.min.js 4KB

dat.gui.min.js 49KB

index.js 2KB

vue.js 283KB

css

style.css 724B

index.html 1KB

<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <title>Simple Rainbow Blobs</title> <link rel="stylesheet" href="css/style.css"> </head> <body> <div id="app"> <div id="svg-container"> <svg id="svg" ref="svg" xmlns="http://www.w3.org/2000/svg" class="blob"> <defs> <filter id="blobFilter"> <feGaussianBlur in="SourceGraphic" :key="blur" :std-deviation.camel="blur" result="blur" /> <feColorMatrix in="blur" mode="matrix" :key="alphaMult+'-'+alphaAdd" :values="'1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 '+alphaMult+' '+alphaAdd" result="goo" />  </filter> </defs> <g :transform="transform"> <circle v-for="e in elements" :cx="e.x" :cy="e.y" :r="e.r" :style="estyle(e)" class="elt" /> </g> </svg> </div> </div> <script src='js/vue.js'></script> <script src='js/dat.gui.min.js'></script> <script src='js/randomColor.min.js'></script> <script src="js/index.js"></script> <div style="text-align:center;margin:5px 0; font:normal 14px/24px 'MicroSoft YaHei';"> <p>适用浏览器：360、FireFox、Chrome、Opera、傲游、搜狗、世界之窗. 不支持Safari、IE8及以下浏览器。</p> <p>来源：<a href="https://www.lanrenzhijia.com/" target="_blank">懒人</a></p> </div> </body> </html>

评论收藏

内容反馈

版权申诉