# Make a GroupFocus scrollable / dynamically adjust a GroupFocus height?

**URL:** <https://forum.bubble.io/t/make-a-groupfocus-scrollable-dynamically-adjust-a-groupfocus-height/44615>\
**Category:** Idea\
**Created:** [December 13, 2018, 6:02pm UTC](https://forum.bubble.io/t/make-a-groupfocus-scrollable-dynamically-adjust-a-groupfocus-height/44615 "2018-12-13T18:02:07Z")\
**Posts on this page:** 1\
**Showing post:** 11

<div class="post-metadata">

**Author:** ![Kfawcett](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/kfawcett/32/38097_2.png) [@Kfawcett](https://forum.bubble.io/u/Kfawcett)\
**Post date:** [January 10, 2019, 2:13pm UTC](https://forum.bubble.io/t/make-a-groupfocus-scrollable-dynamically-adjust-a-groupfocus-height/44615/11 "2019-01-10T14:13:55Z")

</div>

I haven’t tested this, but was trying to think through all of the values you would need. I would trigger it in workflow “when the GF is visible”.

```
function resize() {
// the current height of the window
var h = window.innerHeight;

// the object to update
var target = $('#gf-users');

// the position of the top of the target obejct
var topOfTarget = target.position().top

// the full height of the target object 
var targetHeight = target.outerHeight;

// the height between the top of the target object and the bottom of the window
var result = h - topOfTarget + 'px';

// the current position of the bottom of the target. So we can see if it's below the bottom of the window and trigger the resize.
var bottomOfTargetPosition = topOfTarget + targetHeight;

// make the GF scrollable and fit within the window if the bottom of it is below the bottom of the screen. 
if(bottomOfTargetPosition > h){	
$('#gf-users').css({'height':result, 'overflow-y':'auto'});
}

resize();

$(window).resize(function() {
    resize();
});
```

---

_[View the full topic](https://forum.bubble.io/t/make-a-groupfocus-scrollable-dynamically-adjust-a-groupfocus-height/44615)._