手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >瀑布流布局并自动加载实现代码
瀑布流布局并自动加载实现代码
摘要:自从Pinterest使用了一种新的方式布局取得成功之后,从此互联网出现了布局潮流,我们把他叫做瀑布流!!在互联网流行起来,从国外到国内普遍...

自从Pinterest使用了一种新的方式布局取得成功之后,从此互联网出现了布局潮流,我们把他叫做瀑布流!!在互联网流行起来,从国外到国内普遍存在。国内现有美丽说,蘑菇街,花瓣等代表的网站。

瀑布流是流行一段时间了,现在网上出现了很多的插件。使用起来更是非常的方便。目前用的非常多,并且有是一个juqery的插件masonry,插件地址:http://masonry.desandro.com/

先使用css把一个网页按照从上到下的方式布局好。

使用起来更是非常方便:

我先引用好jquery文件和masonry文件,使用如下代码:

复制代码 代码如下:

$(function(){

var $container = $('#container');

$container.imagesLoaded( function(){

$container.masonry({

itemSelector : '.content_box',

isFitWidth: true,//// 是否可调整大小 Boolean

isRTL:false ////使用从右到左的布局 Boolean

});

});

【瀑布流布局并自动加载实现代码】相关文章:

EasyUI闪屏EasyUI页面加载提示(原理+代码+效果图)

简单的防盗链功能代码(iframe)

强制设为首页代码

图片加载进度实时显示

jQuery结合ajax实现动态加载文本内容

让焦点自动跳转

超酷右下浮出广告窗口代码

实现DIV圆角的JavaScript代码

设为首页 加入收藏的js代码

鼠标图片振动代码

精品推荐
分类导航