Dynamic Fullscreen Pop-in


#1

Hi,

I wouldn’t be asking this if Axure hadn’t archived so many useful forum posts from the past… grrr.

I need to make a fullscreen pop-in that dynamically resizes to the width and height of the browser port. I tried using window.height x 100 and window.width x 100 onClick, but that didn’t work.

Does anyone know how to do this?

Thanks,

DRC


#2

Hi!

You shouldn’t need to multiply by 100. You should just be able to say:

Set size of (dynamic panel) to [[Window.width]] , [[Window.height]]

You may need to also move the panel to (not by) 0,0 as well


#3

Thank you. I was obviously making it more difficult than it needed to be. That worked.

I need to position an “X” for close in the upper right of the pop-in. I’m thinking using the onLoad event and move. But how can I position the button in the upper right with 20 px top, 20 px bottom? Would I use the [[Window.width]], [[Window.height]] divided by something?

Trying to learn but the math (as simple as it is) stumps me.

Thanks.

DRC


#4

Hi!

You could use the OnResize interaction of the dynamic panel itself.

Say you want 10 pixels between the right edge of the “x” and the right edge of the dynamic panel. The following OnResize interaction of the dynamic panel would work:

OnResize
  Move (widget x) to [[This.width - Target.width - 10]]

For an explanation of This and Target, check out this post. But basically This represents the dynamic panel, Target represents the “x”. So if the “x” is 30 wide, it will be moved 40 pixels from the right edge of the dynamic panel, leaving a 10px space between its right edge and the right edge of the DP.

[Edit] For setting the y position, I’m pretty sure you can leave it blank and the y position will remain unchanged. If not, set y to [[Target.y]], which means the widget’s current y position.


#5

Thank you! Very useful. I can see how I could use this in many other situations.

Thank you again!