两款网站loading特效

放置head文件或者footer文件都可以,灵活运用

废话不多说直接上代码

<script type="text/javascript">
jQuery(function(){
jQuery('#loading-one').empty().append('页面加载完毕.').parent().fadeOut('slow');
});</script>
<div id="loading" style="position:fixed !important;position:absolute;top:0;left:0;height:100%; width:100%; z-index:999; background:#000 url(/content/templates/Fys/sucai/dingbu.gif/* 这里可以是自己喜欢的图片*/) no-repeat center; opacity:0.6; filter:alpha(opacity=60);font-size:14px;line-height:20px;" onclick="javascript:turnoff('loading')">
<p id="loading-one" style="color:#fff;position:absolute; top:50%; left:50%; margin:50px 0 0 -50px; padding:3px 10px;" onclick="javascript:turnoff('loading')">页面载入中,请稍后...</p>
</div>

以上代码效果图

使用方法和上面一样

<script type="text/javascript">
jQuery(function(){
jQuery('#loading-one').empty().append('页面加载完毕.').parent().fadeOut('slow');
});</script>
<div id="loading" style="position:fixed !important;position:absolute;top:0;left:0;height:100%; width:100%; z-index:999; background:#000 url(/content/templates/Fys/sucai/loading.gif/* 这里可以是自己喜欢的图片*/) no-repeat center; opacity:0.6; filter:alpha(opacity=60);font-size:14px;line-height:20px;" onclick="javascript:turnoff('loading')">
<p id="loading-one" style="color:#fff;position:absolute; top:50%; left:50%; margin:50px 0 0 -50px; padding:3px 10px;" onclick="javascript:turnoff('loading')">页面载入中,请稍后...</p>
</div>

以上代码效果图

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏蓝天

常用vim设置

    \ if line("'\"")>0&&line("'\"")<=line("$") |

11940
来自专栏张善友的专栏

ASP.NET 主题(Themes)FAQ

1、主题是什么 主题由一组元素组成:外观、级联样式表 (CSS)、图像和其他资源。主题将至少包含外观。主题是在网站或 Web 服务器上的特殊目录中定义的。主题...

20850
来自专栏阿杜的世界

JVM、GC和常用命令

这是11月份的一个分享,借着组内分享的机会,重新梳理了一遍JVM的一些基本概念和学习资料。在这个PPT中,关于G1的部分比较粗略,最近正在恶补G1的知识,后面可...

9930
来自专栏Core Net

Bootstrap table使用心得---thead与td无法对齐的问题

45760
来自专栏快乐八哥

手动实现jQuery Tools里面tab功能

平时开发中用的Javascript类库都是jQuery,用到插件或者第三方类库能从jQuery Tools里面找到,基本不用其他的。当然有时同事喜欢使用jQue...

27490
来自专栏每日一篇技术文章

weex-10-组件a的使用

a标签使用起来比较简单,先留下一个问题,如果想要跳转到html页面怎么实现?我们后面会讲到!

13820
来自专栏九彩拼盘的叨叨叨

vue-router2 写法示例

做单页应用,需要客户端路由。用 Vue.js 做单页应用,一般都用 vue-router 做客户端路由。文档地址点这里。

8520
来自专栏WindCoder

Jquery控制input与selected

当以form表单提交,diabled时无法获取数值,readonly可以获取到数值。

22110
来自专栏Nian糕的私人厨房

jQuery 动态绑定

这是在项目过程中所遇到的一个问题,给 JS 动态生成的元素绑定事件失效,代码如下所示:

29430
来自专栏coding

引用第三方样式库实现动画

animate.css是一个能渲染出炫酷效果的css库,只需引用该css库,在相应的元素上加上class类名,即可实现。

8410

扫码关注云+社区

领取腾讯云代金券