我左侧有几篇文章的栏目。该栏目高度是动态的,基于发布的内容而变化。我右边有一个通常较短的栏目。我拉取了3个大元素和另外5个小元素,并希望填充右侧的元素,直到其接近左侧栏目的高度。
因此,我先拉取所有大元素(3个),并假设这比左侧栏目短。然后我拉取其他5个元素,并附加一个隐藏类(对于没有JS的用户)。现在,我想遍历这5个元素,并继续添加,直到不能再添加为止,否则会使该栏目比左侧栏目更长。以下是我的进展:
问题在于当元素被隐藏时,无法检查其高度,因此我使用hChecking变量来假设新元素的高度约为60像素。这并不理想,因为它们的高度可能小于或大于60像素。
有没有办法在允许元素对于没有JS的人仍然隐藏的情况下使其正常工作?谢谢!
因此,我先拉取所有大元素(3个),并假设这比左侧栏目短。然后我拉取其他5个元素,并附加一个隐藏类(对于没有JS的用户)。现在,我想遍历这5个元素,并继续添加,直到不能再添加为止,否则会使该栏目比左侧栏目更长。以下是我的进展:
var hLeft = $('#home-col-left').outerHeight();
var hRight = $('#home-col-right').outerHeight();
var hRunning = hChecking = 0;
$('#home-col-right').children().each( function () {
hChecking = hRunning + 60;
if (hChecking < hLeft) $(this).removeClass('hidden');
hRunning = hRunning + $(this).outerHeight();
})
问题在于当元素被隐藏时,无法检查其高度,因此我使用hChecking变量来假设新元素的高度约为60像素。这并不理想,因为它们的高度可能小于或大于60像素。
有没有办法在允许元素对于没有JS的人仍然隐藏的情况下使其正常工作?谢谢!
overflow-y:hidden
呢? - Ilia G