Accordion Panel Overlaps

#1

Hi All,
I’m a student and learning Axure for a self project.
I’m creating a mobile prototype with a few accordions - the push/pull widgets are working fine, however, there are two things I’m having trouble figuring out.

Here is a link to my project in Axure: https://7r06rf.axshare.com/#id=ja9bpd&p=1_0_about_pughearts

I’ve created a dynamic panel that encompasses the 7 accordions.
First problem is when a few of the accordions are open, it overlaps my footer that is a component (a part of my base page).

Second,
I would like for the accordions to stay put when scrolling through the dynamic panel that encompasses them, rather than them being pushed up and looking awkward:

image
image.png1148×1337 137 KB

In case it’s needed, each accordion has two states in them – the default and opened state.

image
image.png653×837 16.9 KB

I’ve tried to break away the footer from the component hoping Axure thinks it’s a widget and gets push/pulled when the accordions happen but that didn’t work for me.

Thank you in advance for your help!

#2

It’s a bit tricky to troubleshoot what’s going on without the actual .rp file but I’ll take a crack at it.

Since all the accordion sections are inside a dynamic panel, their push/pull interactions won’t affect the footer that’s outside of it. You need to trigger an event on the same “level” as the footer order for it to move. Setting the dynamic panel to move the widgets below it whenever it resizes is a common way to do it. Accordion.rp (206.7 KB)

I don’t understand the “questions staying put” when scrolling the dynamic panel. So you want to scroll the list of questions separate from scrolling the whole page? And when you do scroll the questions, you want all the questions above the expanded one to remain visible if the user scrolls down?