jQuery实现新浪微博自动底部加载的方法
jQuery ScrollPagination plugin 是一个jQuery 实现的支持无限滚动加载数据的插件。
地址:http://andersonferminiano.com/jqueryscrollpagination/
他的demo下载:http://andersonferminiano.com/jqueryscrollpagination/jqueryscrollpagination.zip
实例代码:
$(function(){
$('#content').scrollPagination({
'contentPage': 'democontent.html', // the url you are fetching the results
'contentData': {}, // these are the variables you can pass to the request, for example: children().size() to know which page you are
'scrollTarget': $(window), // who gonna scroll? in this example, the full window
'heightOffset': 10, // it gonna request when scroll is 10 pixels before the page ends
'beforeLoad': function(){ // before load function, you can display a preloader div
$('#loading').fadeIn();
},
'afterLoad': function(elementsLoaded){ // after loading content, you can use this function to animate your new elements
$('#loading').fadeOut();
var i = 0;
$(elementsLoaded).fadeInWithDelay();
if ($('#content').children().size() > 100){ // if more than 100 results already loaded, then stop pagination (only for testing)
$('#nomoreresults').fadeIn();
$('#content').stopScrollPagination();
}
}
});
// code for fade in element by element
$.fn.fadeInWithDelay = function(){
var delay = 0;
return this.each(function(){
$(this).delay(delay).animate({opacity:1}, 200);
delay += 100;
});
};
});
jQuery实现新浪微博自动底部加载的方法的更多相关文章
- Jquery实现滚动到底部加载更多(最原始)
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8& ...
- jquery页面滑到底部加载更多
$(window).scroll(function(){ var _scrolltop = $('body').scrollTop();if(_scrolltop+_winHeight>_doc ...
- jquery的ajax提交时加载处理方法
1.定义全局的,就是所有的ajax的请求的加载都会出现相同的提示 $(function(){ //加载成功显示的状态 $("#showLoading").ajaxSuccess(f ...
- ASP.NET仿新浪微博下拉加载更多数据瀑布流效果
闲来无事,琢磨着写点东西.貌似页面下拉加载数据,瀑布流的效果很火,各个网站都能见到各式各样的展示效果,原理大同小异.于是乎,决定自己写一写这个效果,希望能给比我还菜的菜鸟们一点参考价值. 在开始之前, ...
- yii2 如何在页面底部加载css和js
作者:白狼 出处:www.manks.top/article/yii2_load_js_css_in_end 本文版权归作者,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接 ...
- 滚动到底部加载更多及下拉刷新listview的使用
最新内容建议直接访问原文:滚动到底部加载更多及下拉刷新listview的使用 本文主要介绍可同时实现下拉刷新及滑动到底部加载更多的ListView的使用. 该ListView优点包括:a. 可自定义下 ...
- Android中GridView滚动到底部加载数据终极版
之前在项目中有一个需求是需要GridView控件,滚动到底部自动加载.但是呢GridView控件并不提供诸如ListView监听滚动到底部的onScrollListener方法,为了实现这样一个效果, ...
- 使用jquery.more.js上滑加载更多
html: <div id="more"> <div class="single_item"> <div class=" ...
- ExtJs基础知识总结:自定义弹窗和ComboBox自动联想加载(四)
概述 Extjs弹窗可以分为消息弹窗.对话框,这些弹窗的方式ExtJs自带的Ext.Msg.alert就已经可以满足简单消息提示,但是相对复杂的提示,比如如何将Ext.grid.Panel的控件显示嵌 ...
随机推荐
- IDEA导入eclipse项目并部署运行完整步骤(转发)
首先说明一下:idea里的project相当于eclipse里的workspace,而idea里的modules相当于eclipse里的project 1.File-->Import Proje ...
- eclipse 修改js文件无法编译到项目中
1.场景重现 在今天修改js文件完善功能时,发现在eclipse中修改了文件后,刷新页面功能无法同步: 2.分析原因 查看编译路径,文件没有修改: 2.1 可能是缓存问题: 2.2 项目未编译: 3. ...
- 线性表之顺序栈C++实现
线性表之顺序栈 栈是限定仅在表尾(栈顶)进行插入删除操作的线性表,FILO:先进后出 一.顺序栈的头文件:SeqStack.h //顺序栈头文件 #include<iostream> us ...
- hdu 3397 线段树
题意: Change operations:0 a b change all characters into '0's in [a , b]1 a b change all characters in ...
- 使用ViewPager实现android软件使用向导的功能
现在的大部分android软件,都是使用说明,就是第一次使用该软件时,会出现向导,可以左右滑动,然后就进入应用的主界面了. 先看下效果图: 首先需要一个布局文件,是FlameLayout组成的,里面包 ...
- 和程序有关的一个游戏<<mu complex>> 攻略
最速打法: 1 - login, brucedayton 2 - login, allomoto 3 - login, m3g4pa55word 4 - unlock, 03/18/34 5 - ss ...
- 开发移动端web页面click事件失效问题
这两天在做一个WAP页面,在chrome上模拟移动端的时候,都好好的,然而放到手机上测试时, 发现有些点击事件直接无反应,但是有些有反应: 难道是由于我页面上有用到滚动插件,里面的touch事件的pr ...
- Syncovery 是目前功能最为强大的实时自动备份工具
Syncovery Pro(原名叫做Super Flexible Synchronizer) 是目前功能最为强大的实时自动备份工具,连FTP.WebDAV等全部支持! 最近从V6开始改用比较好记.易懂 ...
- oracle的dump理解
http://blog.csdn.net/notbaron/article/details/51228444 http://blog.csdn.net/lqx0405/article/details/ ...
- 无法完成你的itunes store 请求发生未知错误50
装上itunes登陆itunes store时遂发现"无法完成您的itunes store的请求,发生未知错误(-50)"跃入眼帘,卸载重装数次还是不见效果,难道是WIN7和itu ...