Axure Tip 14: With a little help from JavaScript

Posted in | Mar 26, 08:44 am

Executing JavaScript within your prototypes
Click image to enlarge

Get a little extra control over your prototypes by using URL executed JavaScript scripts. With thanks to Jeff Harrison for pointing me in the direction of this ‘hack’

Earlier this week, Jeff sent over to me an example Axure widget that cleverly used JavaScript. This was achieved by using the ‘Open Link in Current Window’ interaction, and inserting a short line of JavaScript into the ‘Link to an external URL or file’ field within the dialog.

There are certain limitations as to what could be used in here. Complex JavaScript functions will not work at all, but short pieces of executable code seem to work fine. The trick is to try and eliminate all spaces in the code, and do not use double quote marks (”) as this may terminate the script before it has completed.

The only thing to remember is to prefix the entry with:

JavaScript:

One immediate use I found for this technique was to perform a window re-size when the user clicks some tab or function within the browser window, to simulate a window that changes size according to it’s contents.

The JavaScript for doing this is simply:

JavaScript:window.resizeTo(x,y);

Download an Axure file that demonstrates this behavior here. Enjoy!

By Luke Perman

Comment

  1. Another application of this technique is to configure and open a URL external to the prototype. Here’s a link to a thread in the Axure forum with an example of submitting a Google search from a prototype.

    — Jeff Harrison · Mar 26, 09:46 am

  2. Um. Okay, here’s the link: http://axure.com/cs/forums/thread/5745.aspx

    — Jeff Harrison · Mar 26, 09:47 am

  3. Nice!! Thank you, Luke! Hope you’re doing well!

    — Ralf Gehrig · Mar 26, 04:14 pm

  4. I’m smart enough to ask this question, but not smart enough to answer it immediately:

    Would this mean that it might be possible to do a JS call that sends the right data string to Google Analytics so all the clicking in a prototype could be retrievable in a GA account?

    Nice little project for someone to figure out, I might do that myself. Potentially awesome if it is possible.

    — Richard Warzecha · Mar 26, 05:17 pm







© 2009 AXLIB (Axure RP Design Library) · Axure RP is a registered trademark of Axure Software Solutions, Inc