Scrolling inside dynamic panel ONLY when elements inside are expanded

I have a shopping cart which open-closes as a drawer from the top of the page. The whole drawer is a dynamic panel. Within the dynamic panel are three child dynamic panels which, essentially, are buttons that show-hide content beneath them (or collapse-expand). I want the drawer to only reach a certain height. See photo 1

When all of the panels are collapsed (default state), I do NOT want a scroll bar. Of course. Since there is nothing to scroll to. However, once one or more are opened, the user should be able to scroll down to the bottom. See photo 2

Everything works beautifully; when everything is open, the scrolling is perfect. Except… the scroll bar appears based on the longest content, or longest State, regardless of whether that panel is open or not. This means that there is tons of seemingly pointless blank space underneath the child panels. See video


So even before expanding anything, the panel scrolls? if that’s the case, there is definitely something extending below the bounds of the scrolling panel.

Go into your scrolling panel in Axure and choose Select All from the menu, and look at where the selection ends at the bottom.

[edit] Looking at your screenshot, I’m thinking you have a multi-state dynamic panel inside of the scrolling panel for switching between states. Is that true? If so, right-click that inner panel and make sure it’s set to Fit to Content. Even if you set it that way before, if you manually resize it, that setting will turn off.

Thank you! You helped me solve the issue.

1 Like

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.