您的位置：首页 > Web前端 > HTML

滚动条下拉不断获取新内容

2012-07-02 17:58 197 查看

<html>

<head>

<script src="jquery.js" type="text/javascript"></script>

<script type="text/javascript">

function insertcode() {

var data = new Date();

var $body = $("body");

$body.append('<div style=\" height:50px;border:1px solid red; font-size:24px;\">'+data.getSeconds()+'</div>')

$("#page_tag_load").hide();

}

$(document).ready(function () {

$(window).scroll(function () {

var $body = $("body");

var $html = "";

$html += "<br/>" + ($(window).height() + $(window).scrollTop());

$html += "<br/>window.height: " + $(window).height();

$html += "<br/>body.height: " + $body.height();

$html += "<br/>window.scrollTop: " + $(window).scrollTop();

$("#page_tag_bottom").html($html);

/*判断窗体高度与竖向滚动位移大小相加是否超过内容页高度*/

if (($(window).height() + $(window).scrollTop()) >= ($body.height())) {
$("#page_tag_load").show();
setTimeout('insertcode()', 1000);
// insertcode();

}

});

});

</script>

</head>

<body>
<div style="height: 1000px; font-size: 24px;">新增项目</div>
<div id="page_tag_bottom"
style="width: 100%; position: fixed; top: 0px; background-color: #cccccc; height: 100px;"></div>
<div id="page_tag_load"
style="display: none; font-size: 14px; position: fixed; bottom: 0px; background-color: #cccccc; height: 50px;">加载中...</div>

</body>

</html>

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

标签： html function date div

相关文章推荐

新的分享

章节导航