JQUERY教程

当前位置: HTML5技术网 > JQUERY教程 > 响应式jQuery网格布局插件Grid-A-Licious

响应式jQuery网格布局插件Grid-A-Licious


       响应式jQuery网格布局插件Grid-A-Licious是一个非常棒的响应时布局插件,使用这个插件,你在布局页面的时候就不需要针对不同浏览器的屏幕尺寸写宽度,它会自动根据不同设备自适应宽度。实现了Pinterest瀑布流效果。


源码下载  在线演示
首先新需要引入 jQuery
<script src="js/jquery.js"></script><script src="js/jquery.grid-a-licious.js"></script>
布局HTML代码
<div class="example" id="example">                            <div class="item">                                <div>itur.</div>                            </div>                            <div class="item">                                <div>Dasdasmdhaj hajsdoat.</div>                            </div>                            <div class="item">                                <div>Wxercquinsequat.</div>                            </div></div>
初始化
$("#example").gridalicious({  gutter: 1,  width: 75,  animate: true,  animationOptions: {    speed: 200,    duration: 300,    complete:    onComplete    },});

【响应式jQuery网格布局插件Grid-A-Licious】相关文章

1. 响应式jQuery网格布局插件Grid-A-Licious

2. phonegap教程第8讲 Jquery Mobile中流式布局,网格布局以及响应式布局教程 ...

3. jQuery图片和HTML元素网格布局插件

4. jQuery图片列表拖拽排序布局插件

5. Isotope-jQuery神奇的分类过滤和排序布局插件

6. 创建响应式布局的10款优秀网格工具集锦

7. 创建响应式布局的优秀网格工具集锦

8. 响应式布局的设计方法和响应式前端优化干货

9. CSS3教程:background-clip和background-origin

10. 另外一款超棒的响应式布局jQuery插件 - Freetile.js

本文来源:https://www.51html5.com/a1191.html

点击展开全部

﹝响应式jQuery网格布局插件Grid-A-Licious﹞相关内容

「响应式jQuery网格布局插件Grid-A-Licious」相关专题

其它栏目

也许您还喜欢