设为首页
收藏本站
用户名
Email
自动登录
找回密码
密码
登录
立即注册
只需一步,快速开始
快捷导航
登录
注册
论坛首页
BBS
建站模版
微站设计
虚拟主机
企业邮箱
博客日志
Blog
搜索
搜索
搜索
热搜
长春
优惠
活动
做网站
本版
帖子
用户
本版
帖子
用户
请
登录
后使用快捷导航
没有帐号?
立即注册
道具
勋章
任务
留言板
设置
我的收藏
退出
时时商务社区
»
论坛首页
›
建站资源
›
建站技术
›
异步加载技术实现当滚动条到最底部的瀑布流效果 ...
返回列表
查看:
1939
|
回复:
0
异步加载技术实现当滚动条到最底部的瀑布流效果
[复制链接]
yj1281
当前离线
积分
7391
2487
主题
2487
帖子
7391
积分
论坛元老
论坛元老, 积分 7391, 距离下一级还需 9992608 积分
论坛元老, 积分 7391, 距离下一级还需 9992608 积分
积分
7391
发消息
电梯直达
楼主
发表于 2018-2-14 05:54:35
|
只看该作者
|
倒序浏览
|
阅读模式
异步加载技术实现瀑布流效果。当滚动条到最底部的时候触发一个事件,这个事件写入$.get()事件,向内部程序页传递类别id和页码,程序将会返回那个类别下的相对页的产品列表,如果程序查询当前类无产品即返回空。
滚动条事件要写在window.onscroll中才有效判断。如下:
window.onscroll=function(){
// 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);
});
}
};
您可能感兴趣的文章:
Jquery瀑布流插件使用介绍
jquery简单瀑布流实现原理及ie8下测试代码
纯js实现瀑布流展现照片(自动适应窗口大小)
一个简单的瀑布流效果(主体形式自写)
一则C#简洁瀑布流代码
Blocksit插件实现瀑布流数据无限( 异步)加载
jQuery Masonry瀑布流插件使用详解
thinkphp的URL路由规则与配置实例
thinkphp数据查询和遍历数组实例
thinkphp四种url访问方式详解
ThinkPHP自动完成中使用函数与回调方法实例
thinkPHP实现瀑布流的方法
分享到:
QQ好友和群
QQ空间
腾讯微博
腾讯朋友
收藏
0
回复
使用道具
举报
返回列表
高级模式
B
Color
Image
Link
Quote
Code
Smilies
您需要登录后才可以回帖
登录
|
立即注册
本版积分规则
发表回复
回帖后跳转到最后一页
用户反馈
客户端