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


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设计模式 DAO(数据访问对象模式)
Jun 26 PHP
php中使用PHPExcel读写excel(xls)文件的方法
Sep 15 PHP
PHP中使用break跳出多重循环代码实例
Jan 21 PHP
PHP 绘制网站登录首页图片验证码
Apr 12 PHP
php文件上传类完整实例
May 14 PHP
常用PHP数组排序函数归纳
Aug 08 PHP
php修改数组键名的方法示例
Apr 15 PHP
对于Laravel 5.5核心架构的深入理解
Feb 22 PHP
PHP扩展Swoole实现实时异步任务队列示例
Apr 13 PHP
php校验公钥是否可用的实例方法
Sep 17 PHP
php中文语义分析实现方法示例
Sep 28 PHP
laravel框架中表单请求类型和CSRF防护实例分析
Nov 23 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
WampServer下安装多个版本的PHP、mysql、apache图文教程
2015/01/07 PHP
PHP用户验证和标签推荐的简单使用
2016/10/31 PHP
PHP面向对象程序设计(OOP)之方法重写(override)操作示例
2018/12/21 PHP
laravel 验证错误信息到 blade模板的方法
2019/09/29 PHP
点击广告后才能获得下载地址
2006/10/26 Javascript
JavaScript 学习笔记(五)
2009/12/31 Javascript
jQuery+jqmodal弹出窗口实现代码分明
2010/06/14 Javascript
jQuery Tab插件 用于在Tab中显示iframe,附源码和详细说明
2011/06/27 Javascript
Fastest way to build an HTML string(拼装html字符串的最快方法)
2011/08/20 Javascript
javascript的offset、client、scroll使用方法详解
2012/12/25 Javascript
js写一个字符串转成驼峰的实例
2013/06/21 Javascript
js实现Select下拉框具有输入功能的方法
2015/02/06 Javascript
浅谈JavaScript中的String对象常用方法
2015/02/25 Javascript
jQuery实现的多级下拉菜单效果代码
2015/08/24 Javascript
微信小程序 本地存储及登录页面处理实例详解
2017/01/11 Javascript
详解Nuxt.js部署及踩过的坑
2018/08/07 Javascript
深入理解NodeJS 多进程和集群
2018/10/17 NodeJs
React+EggJs实现断点续传的示例代码
2020/07/07 Javascript
解决vant-UI库修改样式无效的问题
2020/11/03 Javascript
[02:09]EHOME夺得首届辉夜杯冠军—现场颁奖仪式
2015/12/28 DOTA
python中global与nonlocal比较
2014/11/21 Python
使用rpclib进行Python网络编程时的注释问题
2015/05/06 Python
解决python报错MemoryError的问题
2018/06/26 Python
解决pip install xxx报错SyntaxError: invalid syntax的问题
2018/11/30 Python
python3对拉勾数据进行可视化分析的方法详解
2019/04/03 Python
python实现在cmd窗口显示彩色文字
2019/06/24 Python
解决Python正则表达式匹配反斜杠''\''问题
2019/07/17 Python
利用Python绘制Jazz网络图的例子
2019/11/21 Python
Mac PyCharm中的.gitignore 安装设置教程
2020/04/16 Python
使用HTML5 Canvas绘制圆角矩形及相关的一些应用举例
2016/03/22 HTML / CSS
体育课课后反思
2014/04/24 职场文书
个人自荐材料
2014/05/23 职场文书
会议通知范文
2015/04/15 职场文书
婚庆主持词大全
2015/06/30 职场文书
2019新学期家长会工作计划
2019/08/21 职场文书
关于企业的执行力标语大全
2020/01/06 职场文书