Toggle navigation
在线编辑器
在线代码
文本比较
jQuery下载
前端库
在线手册
登录/注册
下载代码
html
css
js
分享到微信朋友圈
X
html
css
body{ background-color:#63a1f4; } .loader1, .loader2, .loader3, .loader4, .loader5, .loader6, .loader7, .loader8, .loader9, .loader10, .loader11, .loader12, .loader13, .loader14, .loader15, .loader16, .loader17, .loader18{ box-sizing:border-box; width:100px; height:100px; position:absolute; animation:rotation 6s infinite linear; } .loader1{ left:100px; top:100px; } .loader2{ left:300px; top:100px; } .loader3{ left:500px; top:100px; } .loader4{ left:700px; top:100px; } .loader5{ left:900px; top:100px; } .loader6{ left:1100px; top:100px; } .loader7{ left:100px; top:300px; } .loader8{ left:300px; top:300px; } .loader9{ left:500px; top:300px; } .loader10{ left:700px; top:300px; } .loader11{ left:900px; top:300px; } .loader12{ left:1100px; top:300px; } .loader13{ left:100px; top:500px; } .loader14{ left:300px; top:500px; } .loader15{ left:500px; top:500px; } .loader16{ left:700px; top:500px; } .loader17{ left:900px; top:500px; } .loader18{ left:1100px; top:500px; } .circle{ box-sizing:border-box; border-radius:50%; } .border-1{ border:2px solid #fff; } .border-2{ border-top:2px solid #fff; border-left:2px solid #fff; border-bottom:2px solid transparent; border-right:2px solid transparent; } .border-3{ border-top:2px solid #fff; border-left:2px solid transparent; border-bottom:2px solid transparent; border-right:2px solid transparent; } .loader18 .border-3, .loader18{ border-bottom:2px solid #fff; } .spinner-container-A{ position:absolute; width:80%; height:80%; left:10%; top:10%; animation:rotation 4s infinite linear; } .spinner-container-B{ position:absolute; width:100%; height:100%; left:0; top:0; animation:rotation 4s infinite linear; } .spinner-container-C{ position:absolute; width:80%; height:80%; left:10%; top:10%; } .spinner-1{ position:absolute; width:50%; height:50%; left:calc(7.32% - 1px); top:calc(7.32% - 1px); } .spinner-2{ position:absolute; width:75%; height:75%; left:calc(3.66% - 1px); top:calc(3.66% - 1px); } .spinner-3{ position:absolute; animation:resize 4s infinite linear; } .spinner-4{ position:absolute; width:100%; height:100%; top:0; left:0; animation:resize 4s infinite linear, rotation 4s infinite linear; } .spinner-5{ position:absolute; width:100%; height:100%; top:0; left:0; animation:resize2 4s infinite linear, rotation 4s infinite linear; } @keyframes rotation{ 0%{ transform:rotate(0deg); } 100%{ transform:rotate(360deg); } } @keyframes resize{ 0%,100%{ width:calc(100% + 4px); height:calc(100% + 4px); left:-2px; top:-2px; } 50%{ width:50%; height:50%; left:calc(7.32% - 1px); top:calc(7.32% - 1px); } } @keyframes resize2{ 0%,100%{ width:calc(100% + 4px); height:calc(100% + 4px); left:-2px; top:-2px; } 50%{ width:50%; height:50%; left:25%; top:25%; } }
JavaScript
粒子
时间
文字
hover
canvas
3d
游戏
音乐
火焰
水波
轮播图
鼠标跟随
动画
css
加载动画
导航
菜单
按钮
滑块
tab
弹出层
统计图
svg
×
Close
在线代码下载提示
开通在线代码永久免费下载,需支付20jQ币
开通后,在线代码模块中所有代码可终身免费下!
您已开通在线代码永久免费下载,关闭提示框后,点下载代码可直接下载!
您已经开通过在线代码永久免费下载
对不起,您的jQ币不足!可通过发布资源 或
直接充值获取jQ币
取消
开通下载
<!doctype html> <html> <head> <meta charset="utf-8"> <title>纯CSS圆圈转动-jq22.com</title> <script src="https://www.jq22.com/jquery/jquery-1.10.2.js"></script> <style>
</style> </head> <body>
<script>
</script>
</body> </html>
2012-2021 jQuery插件库版权所有
jquery插件
|
jq22工具库
|
网页技术
|
广告合作
|
在线反馈
|
版权声明
沪ICP备13043785号-1
浙公网安备 33041102000314号