dede5.7非常漂亮的全站透明层载入效果教程附演示

来源：互联网发布：淘宝好评100字通用评论编辑：程序博客网时间：2024/05/20 03:47

今天站长之家来分享一个非常漂亮的页面加载效果，当内容未加载完成时全页面以黑色透明层显示，中间会有正在加载字样。当内容加载完成时黑色透明层自动消失，本dede教程很简单，大家按照下面的步骤操作即可。

一、在<head></head>之间加入以下代码：
<script type="text/javascript">

</script>

然后再次添加<script type="text/javascript" src="/js/jquery.js"></script>

jquery.js文件可到http://www.apkye.com进行下载。

二、在<body>之后加入以下代码：
<div id="loading"><p id="loading-one" onclick="javascript:turnoff('loading')">页面载入中...</p></div>

三、在CSS中加入以下样式：

#loading{position:fixed!important;position:absolute;top:0;left:0;height:100%;width:100%;z-index:999;opacity:.6;filter:alpha(opacity=60);font-size:14px;line-height:20px;background-color:#000;background-image:url(../img/load.gif);background-repeat:no-repeat;background-position:center center;}
#loading-one{color:#fff;position:absolute;top:50%;left:50%;margin:20px 0 0 -50px;padding:3px 10px;}

四、后面进行生成静态即可看到效果。

全程演示地址：安卓在线www.apkye.com

文章来自全球站长之家（www.dosxp.com）：http://www.dosxp.com/dede_tutorial/4482.html