100% browser height step-by-step for Axure RP 9

Hi friends ~ I’ve found past discussions around 100% browser window height, and sounds like there is a workaround for this that involves typing in Javascript. I’m a complete novice and rely on the Axure GUI entirely for prototyping. Can someone post a detailed step-by-step instructions on how to make a dynamic panel 100% height of the browser window? Someone mentioned a OnWindowChange event (or something like it)… I can’t find that event in the list when I open the New Interaction modal window. Thank you!

Hi!

You can respond to the Window Resized message, and in the Set Size command, specify [[Window.height]] for the height value. So:

On Window Resized
  Set size of dp to width: 100 (or whatever), height: [[Window.height]]

Thanks Joseph! Can you point out where in the attached screenshot I would click on to start typing in the code?

Sure!

First make sure nothing is selected, so that way you get all of the interactions that apply to the page itself. Then choose Window Resized:

If you click the fx button next the height field, it’ll bring up a window giving you more room to type.

Note that this makes the panel the height of the browser window. It won’t make it as tall as the content on the page (i.e., if the page is tall enough to scroll in the window).

Awesome! I typed in the code and it’s not working, but I think we’re really close…

Did I enter it correctly?

Never mind, I misread your first post. I got it working with the following:

1 Like

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