JS弹出DIV层并loading效果_CSS教程,DIV CSS视频教程,DIV CSS模板,DIV CSS布局入门教程

有时候弹出层，由于服务器问题或者由于加载的内容比较多，需要等待几秒才能将内容呈现出来。为了提高用户体验，网站设计人员都会加上Loading 等字样，告诉网页浏览者内容正在加载。不啰嗦了，看代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>DIV+CSS教程 CSS中国 http://www.csschina.net</title> <style> body {margin:0px} #Loading {position:absolute;z-index:10;left:10px;top:10px;border:1px #666666 solid;background:#eeeeee;width:10px;height:10px} .LoadContent {width:100%;height:100%;overflow:auto} </style> <script LANGUAGE="JavaScript">  </script> </head> <body> 由于不能跨域,读取的文件须在同一域名下,如果出现错误,<br>原因是在目标文件上的,本例代码本身没有错误<br> <font color=red>如果目标文件数据过大,花费的时间也相对较长,外部文件需用utf-8编码,否则中文可能显示为乱码</font> <br><br> <a href="javascript:OpenDiv(500,300,'index.html')" _fcksavedurl="javascript:OpenDiv(500,300,'index.html')">forum-1-1.html 500*300</a><br><br> <a href="javascript:OpenDiv(500,200,'faq.php')" _fcksavedurl="javascript:OpenDiv(500,200,'wap.php')">wap.php 500*200</a><br><br> <a href="javascript:OpenDiv(200,500,'1.html')" _fcksavedurl="javascript:OpenDiv(200,500,'1.html')">1.html 200*500</a><br><br> <a href="javascript:OpenDiv(500,500,'801.html')" _fcksavedurl="javascript:OpenDiv(500,500,'801.html')">2.html 500*500</a><br><br> 双击关闭层 <div id="Loading" style="display:none" ondblclick_fckprotectedatt="%20ondblclick%3D%22this.style.display%3D'none'%22"></div> </body> </html>

[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]

CSS教程,DIV CSS视频教程,DIV CSS模板,DIV CSS布局入门教程 - CSS中国

搜索

热门标签

JS弹出DIV层并loading效果