masonry插件实现瀑布流布局并自动加载实现代码
程序员文章站
2022-04-18 20:36:30
自从pinterest使用了一种新的方式布局取得成功之后,从此互联网出现了布局潮流,我们把他叫做瀑布流!!在互联网流行起来,从国外到国内普遍存在。国内现有美丽说,蘑菇街,花瓣等代表的网站。
瀑布流...
自从pinterest使用了一种新的方式布局取得成功之后,从此互联网出现了布局潮流,我们把他叫做瀑布流!!在互联网流行起来,从国外到国内普遍存在。国内现有美丽说,蘑菇街,花瓣等代表的网站。
瀑布流是流行一段时间了,现在网上出现了很多的插件。使用起来更是非常的方便。目前用的非常多,并且有是一个juqery的插件masonry,插件地址:https://masonry.desandro.com/
先使用css把一个网页按照从上到下的方式布局好。
使用起来更是非常方便:
我先引用好jquery文件和masonry文件,使用如下代码:
代码如下:
$(function(){
var $container = $('#container');
$container.imagesloaded( function(){
$container.masonry({
itemselector : '.content_box',
isfitwidth: true,//// 是否可调整大小 boolean
isrtl:false ////使用从右到左的布局 boolean
});
});
下一篇: 01背包、完全背包模板