vue 图片自适应排列插件_jQuery自适应图片排列插件flexImages

flexImages是一款强大的jQuery插件,用于创建谷歌图片流效果,支持图片、文本和视频等多种元素的灵活布局,包括自定义行高、最大行数控制及AJAX无限滚动。通过简单的初始化就能实现高级功能,是前端开发者的好帮手。

f4b5482b8be3624e03cef77e10db5d66.png

8d356dd126880af192ae902c3e671bd1.png

插件描述:flexImages是一款轻量级的jquery插件,它可轻松的创出类似谷歌图片流效果。当然,flexImages可以实现多种模式的排列,排列的对象不限于图片,可以是文本,视频等,排列中也可以显示标题,标题可以显示在图片上,也可以显示在图片下方。更多的详情可参考实例。

更新时间:2019-07-29 11:05:35

更新说明:修改演示图片路径。

flexImages插件功能通过CSS控制平等的图像边距

没有裁剪或重新排序

内置AJAX功能,例如无限滚动

支持延迟加载图片和iframe的内容

选项控制布局,如 maximum按制最大行数。

jquery实例:flexImages使用方法

引入核心文件

构建html

写入JS初始化$('.flex-images').flexImages({rowHeight: 140});

选项

container'.item'包含图片或对象的容器的选择器,如ID,CLASS

object'img'容器内的图片或是对象的选对器

rowHeight180行的最大高度

maxRowsnull最大显示行数. 如果超出则隐藏

truncatefalse最后一行不完整时是否隐藏

评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符  | 博主筛选后可见
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值