jQuery图片元素响应式网格布局插件

时间：2015-08-03 来源：互联网

特效说明：

一款jQuery图片元素响应式网格布局插件下载，该jQuery插件是一款可以将图片或HTML元素均匀分布排列为网格布局的jquery.jMosaic.js插件。适用于响应式网页制作、移动端网页布局图片特效。（兼容测试：IE8及以上、Firefox、Chrome、Opera、Safari、360等主流浏览器）

使用方法：

1、调用CSS样式：
<link rel="stylesheet" type="text/css" href="css/default.css">
<link rel="stylesheet" href="css/jquery.jMosaic.css">

2、调用JS插件代码：
<script src="js/jquery.min.js"></script>
<script src="js/jquery.jMosaic.js"></script>

3、添加HTML代码：
将......之间的html和js代码；放在<body></body>之间。

4、JS代码：
<script type="text/javascript">
   $(document).ready(function() {
       $('.blocks').jMosaic({items_type: "li", margin: 0});
       $('.pictures').jMosaic({min_row_height: 150, margin: 3, is_first_big: true});
   });

   $(window).load(function() {
   });

   $(window).resize(function() {
       $('.pictures').jMosaic({min_row_height: 150, margin: 3, is_first_big: true});
       $('.blocks').jMosaic({items_type: "li", margin: 0});
   });
</script>

标签图片特效 jquery插件网格布局响应式布局响应式图片响应式插件

预览下载收藏分享