+ $viewport = $( this.$clippableScrollableContainer[ 0 ].ownerDocument.body );
+ // Dimensions of the browser window, rather than the element!
+ viewportRect = {
+ top: 0,
+ left: 0,
+ right: document.documentElement.clientWidth,
+ bottom: document.documentElement.clientHeight
+ };
+ viewportRect.top += viewportSpacing.top;
+ viewportRect.left += viewportSpacing.left;
+ viewportRect.right -= viewportSpacing.right;
+ viewportRect.bottom -= viewportSpacing.bottom;
+ } else {
+ $viewport = this.$clippableScrollableContainer;
+ viewportRect = $viewport[ 0 ].getBoundingClientRect();
+ // Convert into a plain object
+ viewportRect = $.extend( {}, viewportRect );
+ }
+
+ // Account for scrollbar gutter
+ direction = $viewport.css( 'direction' );
+ vertScrollbarWidth = $viewport.innerWidth() - $viewport.prop( 'clientWidth' );
+ horizScrollbarHeight = $viewport.innerHeight() - $viewport.prop( 'clientHeight' );
+ viewportRect.bottom -= horizScrollbarHeight;
+ if ( direction === 'rtl' ) {
+ viewportRect.left += vertScrollbarWidth;
+ } else {
+ viewportRect.right -= vertScrollbarWidth;
+ }
+
+ // Add arbitrary tolerance
+ viewportRect.top += buffer;
+ viewportRect.left += buffer;
+ viewportRect.right -= buffer;
+ viewportRect.bottom -= buffer;
+
+ $item = this.$clippableContainer || this.$clippable;
+
+ extraHeight = $item.outerHeight() - this.$clippable.outerHeight();
+ extraWidth = $item.outerWidth() - this.$clippable.outerWidth();
+
+ itemRect = $item[ 0 ].getBoundingClientRect();
+ // Convert into a plain object
+ itemRect = $.extend( {}, itemRect );
+
+ // Item might already be clipped, so we can't just use its dimensions (in case we might need to
+ // make it larger than before). Extend the rectangle to the maximum size we are allowed to take.
+ if ( this.getHorizontalAnchorEdge() === 'right' ) {
+ itemRect.left = viewportRect.left;