小白安全博客

小白记忆
专注网络安全

 网站纯CSS全屏loading特效(由中间向两边散开)

网页特效预览


预览2:gif图片动的有点快

网站纯CSS全屏loading特效(由中间向两边散开)

将代码放在head.php【顶部文件里】

css新建一个css文件

把以下代码放在</head>之前

<link rel="stylesheet" type="text/css" href="<?php echo TEMPLATE_URL; ?>css/loader.css">//路径为自己的css路径


以下PHP代码

<div id="loader-wrapper">
    <div id="loader"></div>
    <div class="loader-section section-left"></div>
    <div class="loader-section section-right"></div>
</div>


CSS代码

此处内容已隐藏,立即评论即可查看


以下代码可任意放

<script type="text/javascript">
    $(window).load(function(){
        $('body').addClass('loaded');
    }); 
</script>



×

感谢您的支持,我们会一直保持!

扫码支持
请土豪扫码随意打赏,请先点一下下面的付款方式

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

 您阅读这篇文章共花了:

打赏作者
版权所有,转载注明出处:小白安全博客-菜鸟安全博客-小白个人博客 » 网站纯CSS全屏loading特效(由中间向两边散开)»https://www.xiaobaibk.com/xiao-bai-160.html

发表评论

表情

网友评论(0)