一个小型、轻量级的JavaScript插件，用于将项目放置在直线行中（jQuery和香草JS版本）–演示：
Posted
tags:
中文标题：一个小型、轻量级的JavaScript插件，用于将项目放置在直线行中（jQuery和香草JS版本）–演示： 原文标题：A small, lightweight JavaScript plugin for placing items in straight rows (jQuery and vanilla JS version) – Demo: 项目评级：Star:669 Fork:84 下载地址：https://github.com/brunjo/rowGrid.js 详情介绍rowGrid.js行
rowGrid.js是一个小型、轻量级（约1000字节gzip）的jQuery插件，用于将图像（或其他项目）放置在直行中。
该网格类似于谷歌图像搜索、flickr、shutterstock和Google+图像上的网格。
特征：
提供了一个不需要jQuery的普通JavaScript版本：https://github.com/brunjo/rowGrid
你喜欢这个项目吗？在推特@3runjo上关注我。
它是如何工作的？
所有项目必须具有相同的高度，但宽度可以是可变的。RowGrid.js将项目对齐为直行，使行的宽度等于容器/父元素的宽度。
在第一行Grid.js调整项目之间的边距。如果这还不够，rowGrid.js会缩小项目。
演示&；示例
示例及说明：http://brunjo.github.io/rowGrid.js/
真实世界示例：https://www.pexels.com/
安装
RowGrid.js需要jQuery 1.7或更高版本。
另外，如果您不想自己托管rowGrid.js，可以使用cdnjs：https://cdnjs.com/libraries/rowgrid.js
您也可以使用Bower或npm进行安装：
用法
重要的是，您要么将宽度和高度声明为img标记上的属性，要么等待图像加载后再启动rowGrid.js。
HTML格式：
JS：
无休止滚动
JS：
选项
项目选择器（必需）
您必须设置此选项。选择器必须引用所有网格项。
最小保证金
这是项目之间的最小水平边距。边距仅在项目之间，而不是在第一个/最后一个项目和容器之间。
最大保证金
这是项目之间的最大水平边距。
调整大小
如果resize设置为true，则布局会在调整大小事件时更新。这对于响应式网站很有用。
最后一行类
最后一行中的第一个项目得到了这个类。
第一项类
每一行中的第一个项目得到这个类。
lastItemClass（最后项目类）
每一行中的最后一项都得到这个类。