Grid-A-Licious jQuery瀑布流响应式布局插件

Grid-A-Licious jQuery瀑布流响应式布局插件
 点击预览  点击下载

Grid-A-Licious 是一个简单易用的 jQuery 插件,可用于创建响应式瀑布流布局,针对不同设备可自动适应宽度。你可以通过参数设置它的宽度以及动态显示时的速度、延迟等等,定制性是比较高的。

使用方法:

1、在 HTML 页面头部中引入 jQuery 框架和 Grid-A-Licious 插件

  1. <script src="jquery.1.8.0.min.js"></script> 
  2. <script src="jquery.grid-a-licious.min.js"></script> 

2、然后按以下方式添加内容,可自定义设置item样式

  1. <div id="demo"> 
  2. <div class="item"> 
  3. 演示演示 
  4. </div> 
  5. ....任意个div 
  6. <div class="item"> 
  7. <div>测试内容...</div> 
  8. </div> 
  9. </div> 

3、初始化Grid-A-Licious

  1. $("#demo").gridalicious({ 
  2. gutter: 10, 
  3. width: 200, 
  4. animate: true
  5. animationOptions: { 
  6. speed: 150, 
  7. duration: 300, 
  8. complete: onComplete 
  9. }, 
  10. }); 

转载请注明:代码家园 » Grid-A-Licious jQuery瀑布流响应式布局插件

评论列表(网友评论仅供网友表达个人看法,并不表明本站同意其观点或证实其描述)