网格和行高 (jquery)
Grid and row height ( jquery)
所以我的网格有问题。我正在使用 Isotope.js 作为网格插件。
我收到了自动调整元素高度的请求,但与此同时,该行中的所有元素都获得了相同的新高度。
最好的解释方式是:http://imgur.com/PVqscxc
我正在考虑任何想法。
第 2 行元素与第 1 行元素高度相同,但其中一个元素的文本比其他元素多,因此该行中的所有其他元素的高度应与文本更多的元素相同
当我过去遇到这个问题时,我决定了我希望网格中的框的高度,然后将其指定为最大高度,并添加了 overflow: auto
以防万一内容不合适。
.box {
height: 200px;
overflow-y: auto;
}
我使用了overflow-y
,因为你只想将滚动条应用到框的垂直边,而auto则使滚动条只在需要的时候显示,而不是一直显示。
使用jQuery动态设置高度
或者,您可以使用 jQuery 获取行中最高框的高度,然后将行中的所有其他框设置为该高度。
一些乐于助人的人已经写了一个漂亮的脚本来做到这一点:https://pressupinc.com/blog/2014/02/setting-dynamic-equal-heights-multiple-elements-jquery/
或者您可以使用这个 jQuery 插件
http://brm.io/jquery-match-height/
所以我的网格有问题。我正在使用 Isotope.js 作为网格插件。
我收到了自动调整元素高度的请求,但与此同时,该行中的所有元素都获得了相同的新高度。
最好的解释方式是:http://imgur.com/PVqscxc
我正在考虑任何想法。
第 2 行元素与第 1 行元素高度相同,但其中一个元素的文本比其他元素多,因此该行中的所有其他元素的高度应与文本更多的元素相同
当我过去遇到这个问题时,我决定了我希望网格中的框的高度,然后将其指定为最大高度,并添加了 overflow: auto
以防万一内容不合适。
.box {
height: 200px;
overflow-y: auto;
}
我使用了overflow-y
,因为你只想将滚动条应用到框的垂直边,而auto则使滚动条只在需要的时候显示,而不是一直显示。
使用jQuery动态设置高度
或者,您可以使用 jQuery 获取行中最高框的高度,然后将行中的所有其他框设置为该高度。
一些乐于助人的人已经写了一个漂亮的脚本来做到这一点:https://pressupinc.com/blog/2014/02/setting-dynamic-equal-heights-multiple-elements-jquery/
或者您可以使用这个 jQuery 插件 http://brm.io/jquery-match-height/