Question

假设我有以下标记（下面提供的jsfiddle）

 <div class="masterContainer"> 
        <div class="filterContainerStrip"> 
            <div class="filterButton">Filter 001</div>
            <div class="filterButton">Filter 002</div>
             ...
        </div>
        <div class="hiddenFilterCount"> ... 4 filters hidden </div>
 </div>

filterButton中可能存在filterContainerStrip个filterButtons个变量，但通过设置max-width，height下降并且不再可见overflow-y: hidden filterButtons容器上的{}和{{1}}。

我想知道当前有多少{{1}}被隐藏，因此我可以将其显示给用户。

这是小提琴jsfiddle

更新小提琴

由于

Answer 1

如果顶部位置（相对于父母）+身高高于父母＆＃39;高度，或左位置+宽度高于父母＆＃39; width假设元素不可见：

$(window).on('resize', function(){
    var hidden = $('.filterButton').filter(function(){  
      return (this.offsetTop + this.offsetHeight > this.parentNode.clientHeight)
          || (this.offsetLeft + this.offsetWidth > this.parentNode.clientWidth);
    });    

   $('.hiddenFilterCount').text('... ' + hidden.length + ' filters hidden');    
});

demo

Answer 2

这应该有效：

var $cont= $('.filterContainerStrip'), contH=$cont.height();

var hiddenEls= $cont.children().filter(function(){
    return $(this).position().top >= contH;
}).length;

$('.hiddenFilterCount').text( hiddenEls+' filters hidden');

DEMO：http://jsfiddle.net/FbXep/3/

保持容器中溢出元素的计数

2 个答案: