您的位置：首页 > 其它

模拟内容还未加载出来的动态小图画

2016-04-11 23:07 169 查看

PHP:

<?php
//jQuery中的load()方法只能接受服务器返回的HTML响应数据
header('Content-Type: text/html');

//模拟网速较慢的情形
sleep(5);
?>
<ul class="nav">
<li><a href="#">首页</a></li>
<li><a href="#">新闻</a></li>
<li><a href="#">动态</a></li>
<li><a href="#">产品大全</a></li>
</ul>

HTML:

<!DOCTYPE html>
<html>
<head>
<title> new document </title>
<meta charset="utf-8" />
</head>

<body>
<div class="header">
<img src="img/loading.gif">
</div>
<hr>
<div class="main">
<h3>这里是首页中的主体内容</h3>
<p>阿里的设计费垃圾收电费了骄傲了啥地方军绿色的减肥了看见了三季度发垃圾的酸辣粉就流口水的减肥了坚实的路口附近了三等奖法律的设计费</p>
<p>阿里的设计费垃圾收电费了骄傲了啥地方军绿色的减肥了看见了三季度发垃圾的酸辣粉就流口水的减肥了坚实的路口附近了三等奖法律的设计费</p>
</div>
<hr>
<div class="footer">
<img src="img/loading.gif">
</div>
<script src="js/jquery-1.11.3.js"></script>
<script>
//页面加载完后后，异步请求header和footer
$(function(){
$('.header').load('2-header.php');
});
</script>
</body>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航