<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<title>Liquid loader</title>
<link rel="stylesheet" href="./style.css">
</head>
<body>
<!-- partial:index.partial.html -->
<svg class="gegga">
<defs>
<filter id="gegga">
<feGaussianBlur in="SourceGraphic" stdDeviation="7" result="blur" />
<feColorMatrix
in="blur"
mode="matrix"
values="1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 20 -10"
result="inreGegga"
/>
<feComposite in="SourceGraphic" in2="inreGegga" operator="atop" />
</filter>
</defs>
</svg>
<svg class="snurra" width="200" height="200" viewBox="0 0 200 200">
<defs>
<linearGradient id="linjärGradient">
<stop class="stopp1" offset="0" />
<stop class="stopp2" offset="1" />
</linearGradient>
<linearGradient
y2="160"
x2="160"
y1="40"
x1="40"
gradientUnits="userSpaceOnUse"
id="gradient"
xlink:href="#linjärGradient"
/>
</defs>
<path
class="halvan"
d="m 164,100 c 0,-35.346224 -28.65378,-64 -64,-64 -35.346224,0 -64,28.653776 -64,64 0,35.34622 28.653776,64 64,64 35.34622,0 64,-26.21502 64,-64 0,-37.784981 -26.92058,-64 -64,-64 -37.079421,0 -65.267479,26.922736 -64,64 1.267479,37.07726 26.703171,65.05317 64,64 37.29683,-1.05317 64,-64 64,-64"
/>
<circle class="strecken" cx="100" cy="100" r="64" />
</svg>
<svg class="skugga" width="200" height="200" viewBox="0 0 200 200">
<path
class="halvan"
d="m 164,100 c 0,-35.346224 -28.65378,-64 -64,-64 -35.346224,0 -64,28.653776 -64,64 0,35.34622 28.653776,64 64,64 35.34622,0 64,-26.21502 64,-64 0,-37.784981 -26.92058,-64 -64,-64 -37.079421,0 -65.267479,26.922736 -64,64 1.267479,37.07726 26.703171,65.05317 64,64 37.29683,-1.05317 64,-64 64,-64"
/>
<circle class="strecken" cx="100" cy="100" r="64" />
</svg>
</body>
</html>
css3液体loading加载特效.rar
需积分: 1 201 浏览量
2023-11-17
16:26:19
上传
评论
收藏 1KB RAR 举报
D6元素
- 粉丝: 5
- 资源: 203
最新资源
- C语言文件读写代码.docx
- python的概要介绍与分析
- module-0982.SyncTensorsGraph.9515.sm-8.0-gpu-after-optimizations
- ChromeSetup20220804.exe
- 讲解记录 基于Java的小区物业管理系统
- module-0004.SyncTensorsGraph.7578.sm-8.0-gpu-after-optimizations
- python39.dll
- 【Matlab 六自由度机器人】Fixed Angles(固定角度) 和 Euler Angles(欧拉角) 之间的区别
- STLINK下载器调试过程中常见问题排查
- BMSP430工程PPT说明书.zip
资源上传下载、课程学习等过程中有任何疑问或建议,欢迎提出宝贵意见哦~我们会及时处理!
点击此处反馈