O'Reilly logo

Programming Social Applications by Jonathan LeBlanc

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Positioning the Message Windows

Displaying a message to your gadget users is a great way to inform them of pertinent changes, upsell items for in-app purchases, and more. Many times, you’ll want to position those windows in a specific spot in your application to prevent the default pop-up location from being used and supplemental content from being covered.

There are a few methods available for positioning single windows or all windows at once.

Positioning a single message

If you have multiple mini-message windows that you want to position at different locations, or if you only have a single message in the gadget that you would like to position, then it may be easiest to position one window at a time.

In addition to allowing plain text for the content of a message window, the createDismissibleMessage() method also accepts a DOM node reference that denotes the window’s HTML-based content.

Again taking the dismissible message gadget sample as our foundation, we can change the Content section to dictate the position on the page that a message window should be displayed, based on where the DOM node is placed:

<Content view="canvas"> <![CDATA[ <style type="text/css"> #msgWindow{ width:200px; float:right; } </style> <div id="msgWindow"> <b>This is my message header</b><br /> Visit <a href="http://www.mysite.com">my site</a> for more details. </div> <script type="text/javascript"> //create new mini-message object var message = new gadgets.MiniMessage(__MODULE_ID__); //get the message node and ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required