Question

我一直在看这里的几个帖子，问题与此类似，但没有一个能解决我的问题。

我在这里发布HTML：

        <div id="scroller" class="general_scrollingContainer" layout="column" layout-fill layout-align="top left">
            <ul class="dynamic-grid"  angular-grid="pics"
                                      ag-grid-width="200"
                                      ag-gutter-size="10"
                                      ag-id="gallery"
                                      refresh-on-img-load="true">
                <li class="grid" ng-repeat="product in products">
                    <a ng-href="{{product.link_shop}}" target="_blank">
                        <img class="grid-img" ng-src="{{product.url_imagen}}" />
                    </a>
                    <div class="img-desc-wrap" layout="column" layout-fill layout-align="top left">
                          <a class="title" ng-href="{{product.link_shop}}" target="_blank" style="font-size:12px;line-height:16px">
                              {{product.title}}
                          </a>
                          <div class="date"><b>Category</b>: {{product.category_name}}</div>
                          <div class="object_icons_holder" layout="row" layout-align="space-between stretch">
                              <div flex layout-align="start center" layout="row">
                                  <ng-md-icon icon="share" size="30" style="fill:#666;margin:-5px 0 0 10px" class="social_icon" aria-label="Share Product"
                                              ng-click="showSocialShare($event, 0)">
                                      <md-tooltip md-direction="top">
                                          Share in Social Networks
                                      </md-tooltip>
                                  </ng-md-icon>

                              </div>
                              <div class="shop_price">{{product.price}}</div>
                          </div>
                     </div>
                 </li>
            </ul>
        </div>

班级 general_scrollingContainer 的CSS：

.general_scrollingContainer {
  overflow-y: scroll;
  padding: 0 10px;
  width: 100%;
}

和一个带有事件的Javascript，该事件调整div的可见高度以进行调整：

$(window).resize(function() {
   var $main_container = $(window).height();
   $(".general_scrollingContainer").css({
         "height": ($main_container - 160) + 'px'
   });
});

主div' general_scrollingContainer '具有固定的高度，具体取决于窗口高度，内部是溢出可见区域的元素。

问题是我在滚动到底部并且需要div的实际高度（包括高度不可见）时尝试获取事件。

使用$('div.general_scrollingContainer').innerHeight()，仅显示DIV可见区域的高度，与$('div.general_scrollingContainer').height()的值相同，因此我不知道如何获得整个高度。

任何帮助？

Answer 1

对于内容的高度，获取div中ul元素的高度。如果你有多个元素，你可以将它包装在另一个内部内容div中并获得它的高度。

溢出内容中的Div高度

1 个答案: