页面特效 UI组件库 菜单导航 窗口特效 幻灯片滑动 图像相册 表单 选项卡 表格 评分星级 手风琴 文本链接 布局 日历 颜色选择器 按钮 图表 html5 提示 ExtJS 在线客服 其他特效 地图 树形控件 移动开发 BootStrap 滑动条 文件上传 表单验证 分页 播放器 Angular VUE

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

布局 HTML我帮您 1年前  次浏览
响应式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
    },
});
      

相关链接

发表评论