thinkPHP实现瀑布流的方法_php实例
程序员文章站
2022-04-09 15:46:05
...
本文实例讲述了thinkPHP实现瀑布流的方法。分享给大家供大家参考。具体分析如下：
Insert title here
加载中，请稍后...
";
});
var $newElems = $(html).css({ opacity: 0 }).appendTo($container);
$newElems.imagesLoaded(function(){
$newElems.animate({ opacity: 1 });
$container.masonry( 'appended', $newElems, true );
});
//一次请求完成，将on设为false，可以进行下一次的请求
loading.data("on", false);
}
loading.fadeOut();
},
"json"
);
}
});
});
很多人都想做瀑布流的效果,这里告诉大家官网使用的方法,首先要下载瀑布流的插件jquery.masonry.min.js 地址：http://masonry.desandro.com/index.html里面包含的很多示例.
流程:
1. 页面初始化时,调用插件进行一次排版；
2. 当用户将滚动条拖到底部时,用ajax加载一次数据,并排版显示
3. 重复2,直到无数据
Html代码:
复制代码 代码如下:
瀑布流下来了
加载中，请稍后...
});
var $newElems = $(html).css({ opacity: 0 }).appendTo($container);
$newElems.imagesLoaded(function(){
$newElems.animate({ opacity: 1 });
$container.masonry( 'appended', $newElems, true );
});
//一次请求完成，将on设为false，可以进行下一次的请求
loading.data("on", false);
}
loading.fadeOut();
},
"json"
);
}
});
});