异步加载技术实现当滚动条到最底部的瀑布流效果


Posted in PHP onSeptember 16, 2014

异步加载技术实现瀑布流效果。当滚动条到最底部的时候触发一个事件,这个事件写入$.get()事件,向内部程序页传递类别id和页码,程序将会返回那个类别下的相对页的产品列表,如果程序查询当前类无产品即返回空。

滚动条事件要写在window.onscroll中才有效判断。如下:

window.onscroll=function(){<br>
// var scrolltop=document.documentElement.scrollTop||document.body.scrollTop;
var tops = $(document).scrollTop(); //获取滚动条的位置
var sctop = $(document).height()-$(window).height();
var id = $("#ajax_claid").val();
if(!id){
id=8;
}
$("#ajax_p").val(tops);
if(tops>=sctop)//成立说明滚动条已在最底部
{
var b=$("#ajax_p").val();
if(b>a){
page=page+1;//传递页码
}
var Url = "aja_pro/"+id+"/"+page;//程序页面,查询信息返回数据,直接返回带html的信息。

$.get(Url,function(data){
$("#aja_jia").append(data);
});

}
};
PHP 相关文章推荐
PHP开发大型项目的一点经验
Oct 09 PHP
如何隐藏你的.php文件
Jan 04 PHP
PHP中设置时区,记录日志文件的实现代码
Jan 07 PHP
php输出1000以内质数(素数)示例
Feb 16 PHP
深入讲解PHP Session及如何保持其不过期的方法
Aug 18 PHP
thinkphp3.2实现上传图片的控制器方法
Apr 28 PHP
PHP中函数gzuncompress无法使用的解决方法
Mar 02 PHP
thinkphp3.2实现跨控制器调用其他模块的方法
Mar 14 PHP
php显示页码分页类的封装
Jun 08 PHP
laravel项目利用twemproxy部署redis集群的完整步骤
May 11 PHP
PHP 结合 Boostrap 结合 js 实现学生列表删除编辑及搜索功能
May 21 PHP
laravel框架模板之公共模板、继承、包含实现方法分析
Aug 30 PHP
PHP+iFrame实现页面无需刷新的异步文件上传
Sep 16 #PHP
PHP使用静态方法的几个注意事项
Sep 16 #PHP
PHP处理JSON字符串key缺少双引号的解决方法
Sep 16 #PHP
php中使用PHPExcel读写excel(xls)文件的方法
Sep 15 #PHP
PHP常量使用的几个需要注意的地方(谨慎使用PHP中的常量)
Sep 12 #PHP
php修改指定文件后缀的方法
Sep 11 #PHP
MyEclipse常用配置图文教程
Sep 11 #PHP
You might like
php 网上商城促销设计实例代码
2012/02/17 PHP
PHP 利用AJAX获取网页并输出的实现代码(Zjmainstay)
2012/08/31 PHP
php中使用redis队列操作实例代码
2013/02/07 PHP
php截取字符串之截取utf8或gbk编码的中英文字符串示例
2014/03/12 PHP
PHP实现一维数组转二维数组的方法
2015/02/25 PHP
PHP实现的迷你漂流瓶
2015/07/29 PHP
php图形jpgraph操作实例分析
2017/02/22 PHP
PHP5.5新特性之yield理解与用法实例分析
2019/01/11 PHP
JavaScript 获得选中文本内容的方法
2009/02/15 Javascript
定时器(setTimeout/setInterval)调用带参函数失效解决方法
2013/03/26 Javascript
jQuery 设置 CSS 属性示例介绍
2014/01/16 Javascript
javascript学习笔记(七)Ajax和Http状态码
2014/10/08 Javascript
举例说明JavaScript中的实例对象与原型对象
2016/03/11 Javascript
用Angular实时获取本地Localstorage数据,实现一个模拟后台数据登入的效果
2016/11/09 Javascript
JavaScript字符串对象
2017/01/14 Javascript
webpack打包nodejs项目的方法
2018/09/26 NodeJs
移动端 Vue+Vant 的Uploader 实现上传、压缩、旋转图片功能
2019/06/10 Javascript
node.js使用net模块创建服务器和客户端示例【基于TCP协议】
2020/02/14 Javascript
基于JS+HTML实现弹窗提示是否确认提交功能
2020/06/17 Javascript
JS实现斐波那契数列的五种方式(小结)
2020/09/09 Javascript
[52:10]LGD vs Optic Supermajor小组赛D组胜者组决赛 BO3 第二场 6.3
2018/06/04 DOTA
深入理解Python装饰器
2016/07/27 Python
Python简单的制作图片验证码实例
2017/05/31 Python
python创建文件时去掉非法字符的方法
2018/10/31 Python
python切片的步进、添加、连接简单操作示例
2019/07/11 Python
django序列化serializers过程解析
2019/12/14 Python
pycharm工具连接mysql数据库失败问题
2020/04/01 Python
html5中的input新属性range使用记录
2014/09/05 HTML / CSS
JD Sports马来西亚:英国领先的运动鞋和运动服饰零售商
2018/03/13 全球购物
非常详细的C#面试题集
2016/07/13 面试题
代办委托书怎样写
2014/04/08 职场文书
2015年中秋节演讲稿
2015/03/20 职场文书
2015年扫黄打非工作总结
2015/05/13 职场文书
公司趣味运动会开幕词
2016/03/04 职场文书
javascript实现计算器功能详解流程
2021/11/01 Javascript
德劲DE1102数字调谐收音机机评
2022/04/07 无线电