1. <html>
  2. <head>
  3. <link rel="dns-prefetch" href="http://i.tq121.com.cn">
  4. <meta charset="utf-8" />
  5. <title>滚动加载|jquery.endless-scroll插件|使用demo</title>
  6. <script type="text/javascript" src="http://i.tq121.com.cn/j/core.js"></script>
  7. <script>W.css("c/core.css","c/tqzt/zhibo.css")</script>
  8. </head>
  9. <body>
  10. <script>
  11. //延时加载 jquery.endless-scroll 插件使用方法
  12. W.use('j/plugs/jquery.endless-scroll.js',function(){
  13.     $(document).endlessScroll({
  14.         bottomPixels: 450,
  15.         fireDelay: 10,
  16.         callback: function(){
  17.             console.log('又加载一次数据')
  18.             $('.main ul').append($('.main ul').html());
  19.         }
  20.     });
  21. })
  22. </script>
  23. <div class="box">
  24.     <div class="main_box">
  25.         <div class="main">
  26.             <h2><i></i>
  27.                 <span>最新报道</span></h2>
  28.             <ul>
  29.                 <li>
  30.                     <h3>
  31.                         <a href="http://news.weather.com.cn/2014/10/2213662.shtml" target="_blank">北京马拉松霾中跑</a>
  32.                     </h3>
  33.                     <i>（2014-10-19 11:05:52）</i>
  34.                     <div class="img">
  35.                         <p><img src="http://cms.weather.com.cn/site2/images/cn/newzt/zbzt/2014/10/19/CBE09A9C28E02076B04959FB6352847B.jpg" alt=""></p>
  36.                     </div>
  37.                     <div class="zhaiyao">10月19日早上，2014北京马拉松比赛开赛，18日下午18时，北京市政府已正式发布空气重污染蓝色预警。北京马拉松比赛组委会18日晚21时紧急发布温馨提示，请参赛选手根据自身情况选择参赛。当日，北京PM2.2超过300，空气重度污染。...
  38.                         <a href="http://news.weather.com.cn/2014/10/2213662.shtml" target="_blank">[详细]</a>
  39.                     </div>
  40.                 </li>
  41.                 <li>
  42.                     <h3>
  43.                         <a href="http://news.weather.com.cn/2014/10/2212568.shtml" target="_blank">17日夜间至20日京津冀局地有重度霾</a>
  44.                     </h3>
  45.                     <i>（2014-10-17 09:16:58）</i>
  46.                     <div class="img">
  47.                         <p><img src="http://cms.weather.com.cn/site2/images/cn/newzt/zbzt/2014/10/17/E80251CCE5620CFBA5FBCE8A230F88EC.jpg" alt=""></p>
  48.                     </div>
  49.                     <div class="zhaiyao">中国天气网讯 继10月7-11日中东部遭遇大范围雾或霾天气之后，时隔不到一周，今夜（17日）起，华北中南部、黄淮等地将再迎雾或霾天气，其中北京东南部、河北中南部、天津西部等地局地将有重度霾。20日夜间，受南下冷空气影响，上述地区雾、霾天气将自北向南逐步减弱或消散。...
  50.                         <a href="http://news.weather.com.cn/2014/10/2212568.shtml" target="_blank">[详细]</a>
  51.                     </div>
  52.                 </li>
  53.                 <li>
  54.                     <h3>
  55.                         <a href="http://news.weather.com.cn/2014/10/2212568.shtml" target="_blank">17日夜间至20日京津冀局地有重度霾</a>
  56.                     </h3>
  57.                     <i>（2014-10-17 09:16:58）</i>
  58.                     <div class="img">
  59.                         <p><img src="http://cms.weather.com.cn/site2/images/cn/newzt/zbzt/2014/10/17/E80251CCE5620CFBA5FBCE8A230F88EC.jpg" alt=""></p>
  60.                     </div>
  61.                     <div class="zhaiyao">中国天气网讯 继10月7-11日中东部遭遇大范围雾或霾天气之后，时隔不到一周，今夜（17日）起，华北中南部、黄淮等地将再迎雾或霾天气，其中北京东南部、河北中南部、天津西部等地局地将有重度霾。20日夜间，受南下冷空气影响，上述地区雾、霾天气将自北向南逐步减弱或消散。...
  62.                         <a href="http://news.weather.com.cn/2014/10/2212568.shtml" target="_blank">[详细]</a>
  63.                     </div>
  64.                 </li>
  65.             </ul>
  66.         </div>
  67.     </div>
  68. </div>
  69. </body>
  70. </html>

滚动加载|页面滑到底部加载数据|jquery.endless-scroll插件|使用demo的更多相关文章

  1. jquery页面滑到底部加载更多

    $(window).scroll(function(){ var _scrolltop = $('body').scrollTop();if(_scrolltop+_winHeight>_doc ...

  2. Layman H5+Webapp+MUI App 页面滑至到底部自动加载新的内容

    要点:使用jquery的scroll()方法实现,当用户滚动指定的元素时,会发生 scroll 事件 scroll 事件适用于所有可滚动的元素和 window 对象(浏览器窗口) scroll() 方 ...

  3. js加载页面使用execute_script选定加载位置

    #由于js逐步加载页面,存在未显示的网页无法加载源码 from selenium import webdriver driver = webdriver.Firefox() init_element ...

  4. uni-app中不使用scroll-view组件,监听页面滑直底部事件

    最终达到的目标效果 将要用到 监听页面滚动事件:onPageScroll 获取节点信息uni.createSelectorQuery() 标签布局 <template> <view ...

  5. flutter 入口文件配置路由+加载页面

    入口文件配置路由 1.路由信息 -- 加载页面 ,通常用于显示新的内容或者广告,加载完成之后进入主页面 -- 主页面 /app 2.配置页面  main.dart main.dart // main ...

  6. Ajax--PHP+JQuery+Ajax解析json、XML数据、加载页面

    一.JQuery+Ajax用get.post方式提交和请求数据 知识要点: $('#userName').blur(function () { var txt = $(this).val(); $.a ...

  7. RecyclerView 判断滑到底部 顶部 预加载 更多 分页 MD

    Markdown版本笔记 我的GitHub首页 我的博客 我的微信 我的邮箱 MyAndroidBlogs baiqiantao baiqiantao bqt20094 baiqiantao@sina ...

  8. yii2 如何在页面底部加载css和js

    作者:白狼 出处:www.manks.top/article/yii2_load_js_css_in_end 本文版权归作者,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接 ...

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

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

随机推荐

  1. Windows下安装 Linux 下vim编辑器

    Windows下安装vim编辑器 下载传送门 https://vim.en.softonic.com/download# 开始安装 这是下载后的可执行文件 双击(或单击)运行软件,选择同意继续进行安装 ...

  2. linux下僵尸进程的发现与处理

    一.概述 僵尸进程是怎么产生的 当子进程退出时,父进程没有调用wait函数或者waitpid()函数等待子进程结束,又没有显式忽略SIGCHLD信号,那么它将一直保持在僵尸状态,如果这时父进程结束了, ...

  3. Java的常用API之System类简介

    Syetem类 java.lang.System类中提供了大量的静态方法,可以获取与系统相关的信息或系统级操作,在System类的API文档中,常用的方法有: public static long c ...

  4. 命令源码文件——Golang

    源码文件又分为三种,即:命令源码文件.库源码文件和测试源码文件,它们都有着不同的用途和编写规则. 命令源码文件:1.独立程序的入口2.属于main包,包含无参数和无结果的main函数3.main函数执 ...

  5. Tomcat 类加载器的实现

    Tomcat 内部定义了多个 ClassLoader,以便应用和容器访问不同存储库中的类和资源,同时达到应用间类隔离的目的.本文首发于公众号:顿悟源码. 1. Java 类加载机制 类加载就是把编译生 ...

  6. WebApi自定义全局异常过滤器及返回数据格式化

    WebApi在这里就不多说了,一种轻量级的服务,应用非常广泛.我这这里主要记录下有关 WebApi的相关知识,以便日后使用. 当WebApi应用程序出现异常时,我们都会使用到异常过滤器进行日志记录,并 ...

  7. IIS 图片 JS CSS 500错误

    1.检查站点MIME类型是否可以正常加载

  8. EF之DataBase添加新字段

    数据库中表添加新字段后,在EF的xml格式的中找到与表名相同的节点添加新字段 (SSDL.CSDL和C-S都要添加相关信息)

  9. Jmeter的安装与配置。

    1.本机配置好JAVA环境. 2.官网下载压缩包,在任意目录下解压. 3.修改配置文件 ,打开Jmeter的bin目录下jmeter.porperties,修改 language=zh_CN samp ...

  10. Java自学-异常处理 自定义异常

    Java 自定义异常 示例 1 : 创建自定义异常 一个英雄攻击另一个英雄的时候,如果发现另一个英雄已经挂了,就会抛出EnemyHeroIsDeadException 创建一个类EnemyHeroIs ...