<!DOCTYPE=html>

<html>

<head>

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

   < script type="text/javascript">

    $(document).ready(function(){

        var range = 50;             //距下边界长度/单位px

        var elemt = 500;           //插入元素高度/单位px

        var maxnum = 20;            //设置加载最多次数

        var num = 1;

        var totalheight = 0;

        var main = $("#content");                     //主体元素

        $(window).scroll(function(){

            var srollPos = $(window).scrollTop();    //滚动条距顶部距离(页面超出窗口的高度)

            //console.log("滚动条到顶部的垂直高度: "+$(document).scrollTop());

            //console.log("页面的文档高度 ："+$(document).height());

            //console.log('浏览器的高度：'+$(window).height());

            totalheight = parseFloat($(window).height()) + parseFloat(srollPos);

    		if(($(document).height()-range) <= totalheight  && num != maxnum) {

                main.append("<div style='border:1px solid tomato;margin-top:20px;color:#ac"+(num%20)+(num%20)+";height:"+elemt+"' >hello world"+srollPos+"---"+num+"</div>");

                num++;

            }

        });

    });

    </ script>

</head>

<body>

    <div id="content" style="height:960px">

        <div id="follow">this is a scroll test;<br/>    页面下拉自动加载内容</div>

		<div style='border:1px solid tomato;margin-top:20px;color:#ac1;height:800' >hello world test DIV</div>

    </div>

</body>

</html>

　　

页面滚动动态加载数据，页面下拉自动加载内容 jquery的更多相关文章

  1. Jquery页面滚动动态加载数据，页面下拉自动加载内容

    <!DOCTYPE=html> <html> <head> <script src="js/jquery.js" type="t ...

  2. wap 往下拉自动加载更多数据

    var stop=true; $(window).scroll(function(){ totalheight = parseFloat($(window).height()) + parseFloa ...

  3. 分页插件思想：pc加载更多功能和移动端下拉刷新加载数据

    感觉一个人玩lol也没意思了,玩会手机,看到这个下拉刷新功能就写了这个demo! 这个demo写的比较随意,咱不能当做插件使用,基本思想是没问题的,要用就自己封装吧! 直接上代码分析下吧! 布局: & ...

  4. 滚动到底部加载更多及下拉刷新listview的使用

    最新内容建议直接访问原文:滚动到底部加载更多及下拉刷新listview的使用 本文主要介绍可同时实现下拉刷新及滑动到底部加载更多的ListView的使用. 该ListView优点包括:a. 可自定义下 ...

  5. YCRefreshView-自定义支持上拉加载更多，下拉刷新。。。

    自定义支持上拉加载更多,下拉刷新,支持自由切换状态[加载中,加载成功,加载失败,没网络等状态]的控件,拓展功能[支持长按拖拽,侧滑删除]可以选择性添加 .具体使用方法,可以直接参考demo. 轻量级侧 ...

  6. ListView下拉刷新，上拉自动加载更多

    下拉刷新,Android中非常普遍的功能.为了方便便重写的ListView来实现下拉刷新,同时添加了上拉自动加载更多的功能.设计最初是参考开源中国的Android客户端源码.先看示例图.       ...

  7. Android UI--自定义ListView(实现下拉刷新+加载更多）

    Android UI--自定义ListView(实现下拉刷新+加载更多) 关于实现ListView下拉刷新和加载更多的实现,我想网上一搜就一堆.不过我就没发现比较实用的,要不就是实现起来太复杂,要不就 ...

  8. Android打造(ListView、GridView等)通用的下拉刷新、上拉自动加载的组件

    原文 http://blog.csdn.net/bboyfeiyu/article/details/39253051       前言 下 拉刷新组件在开发中使用率是非常高的,基本上联网的APP都会采 ...

  9. Android中自定义ListView实现上拉加载更多和下拉刷新

    ListView是Android中一个功能强大而且很常用的控件,在很多App中都有ListView的下拉刷新数据和上拉加载更多这个功能.这里我就简单记录一下实现过程. 实现这个功能的方法不止一个,Gi ...

随机推荐

  1. 仿360手机卫士界面效果android版源码

    仿360手机卫士界面效果android版,这个今天一大早在源码天堂的那个网站上看到了一个那个网站最新更新的一个源码,所以就分享给大学习一下吧,布局还挺不错的,而且也很简单的,我就不把我修改的那个分享出 ...

  2. Java Web容器的启动与处理请求的过程

    容器启动时的加载顺序 一.启动一个WEB项目的时候,WEB容器会去读取它的配置文件web.xml,读取<context-param>结点.二.容创建一个ServletContext(ser ...

  3. dom4j api 详解--XPath 节点详解

    dom4j api 详解 http://871421448.iteye.com/blog/1546955 XPath 节点 http://www.w3school.com.cn/xpath/xpath ...

  4. Android核心组件 Service

    Service: 服务 Service 是Activity系统的核心组件之一. 因此需要继承和注册 Service 是内有界面的, 适合在后台长期的执行任务. (如放歌, 检测版本跟新, 下载, 上传 ...

  5. 排序，求几个最值问题，输入n个整数，输出其中最小的k个元素。

    看完两个求最大值算法之后的一些感想. 如果想直接看算法的可以跳过.但是我觉得我这些想法还是比较有用的,至少对我将来的算法设计是这样的. 算法的功能越强大,必然意味着速度慢,因为根据丛林法则,那种慢又功 ...

  6. CentOS配置vsftpd遇到550错误的解决办法

    默认情况下用root是无法连接的,你可以创建一个非root帐户登录,但是登录是可以登录,却没有办法创建或是上传文件.有人说,可以把 SELinux关掉,可是这样未免也有点尺度太大了,其实是SELinu ...

  7. PDF ITextSharp

    示例源码 //Document:(文档)生成pdf必备的一个对象,生成一个Document示例 Document document = new Document(PageSize.A4, 30, 30 ...

  8. asp.net mvc Ajax.BeginForm不能异步刷新，或转到新页面，或页面还是刷新了，的原因(或解决办法)（转）

    昨天搞了一下午的Ajax.BeginForm都没能实现异步刷新,一直将返回的数据提交到新的页面,在网上搜了n多方法都不行,问了n多人都没能搞定,今天大一早,就意外的被我发现了问题所在. 布局页: &l ...

  9. ActiveMQ中Session设置的相关理解

    名词解释: P:生产者 C:消费者 服务端:P 或者 ActiveMQ服务 客户端:ActiveMQ服务 或者 C 客户端成功接收一条消息的标志是这条消息被签收.成功接收一条消息一般包括如下三个阶段: ...

  10. iOS 深复制&浅复制

        1.无论是深复制还是浅复制,被复制的对象类型是不变的.此对象类型具有什么功能就具有什么功能,不会因为自行修改了返回对象的指针类型而改变.   比如: 这里的str和str1的值和指针地址完全一 ...