MAGNA web studio • Developers' Corner

BS"D

magna

web studio

Loading.
Please wait...

WB-Developers' Corner

[rz] SAO

Browser Size Activated Object (aka "SAO").

This extreme lightweight extension allows you to activate and deactivate objects based on the visitor's browser size.
Redirection is also supported; so, it can be used as mobile redirection based on the device's screen resolution.
Show alerts based on the page design/scheme (portrait/landscape).
Multi-instance supported, this allows many configurations in the same page.
Of course, it is limited by your creativity!

HTML 4.01 Transitional
W3C compliant

DEMO

* Just a brief about some of the changes that were made lately...

* New inversion 1.2

- Width and height parameters can be calculated based on the browser size or the physical screen size.
- The visitor can optionally be prompted prior to the redirection.
- The prompt feature automatically detects a [rz] Confirm() instance.

* New in version 1.1.0.2

- Fixed an introduced bug detecting some type of devices.
- Improved code.

* New in version 1.1

- Object deactivation.
- Can activate (show) or deactivate (hide) more than one object in the same instance and under the same conditions;
if this is your case, just enter each object id separated by commas, i.e. Layer1, Layer2, etc.
- Event(s) on activation and on deactivation; user defined function call in javascript format: myfunction();
- Matching events can be triggered (or not) when the page is loaded or when the condition is reached.
- Improved code; all events are triggered only once, this means, when the browser's conditions are changed instead of in
each resize.
- Device condition (based on the user agent string); can be: determinant - this means no matter what the other conditions are,
i.e. useful for mobile redirection), must match - the conditions must match with the device in order to trigger the proper
activations, deactivations and events; this option can even be excluded.
- Improved screen size and orientation calcs.

How to use?

- Design your page as you usually do.
- Add an object (often a layer with the appropiate legend) as the last object (the topmost position).
- Finally, add the extension; must be over the layer or the object to be shown
(if you use a layer, due to technical reasons, it is advisable to put the extension within it).
- Open the extension properties dialog and set-up the parameters;
properties with their descriptions are self-explanatory.
- You can use a redirection link instead of display an object;
this can be useful i.e. to redirect to a mobile version of your site according to the device's resolution.
- Run a preview and resize your browser to see it in action.

Enjoy!

new shop with