HTML5 Data Bindings Browser Properties Manual Support

Rich information about the browser and device your visitor is using

Discover your visitors' browser properties and adjust your pages dynamically. Show different content based on browser resolution and language, special retina ready HD images or low resolution images for small devices and much more with the Browser Properties Add-on for HTML5 Data Bindings.

The supplied data bindings contain rich information about the browser and device your visitor is using, so you can dynamically adjust your web site accordingly.
This extension requires HTML5 Data Bindings
$22.00
- OR -

Features

@userAgent - Contains information if a user is viewing your web site from a mobile or desktop web browser so that you can then auto detect and display the appropriate version of your web site.  Using the user agent you can show different messages to your.

@language
- Contains the language of the user’s version of the browser. This way you can automatically redirect the user to the matching language version of your website, if available. Using the language, you can also show a specific message depending on the detected language, or even filter your data source.

@devicePixelRatio - Contains the device resolution, the ratio between physical device pixels and DPI-adjusted logical CSS pixels. Using the Device Pixel Ratio you can check if the device your site is loaded into is a Retina Display Device. If it is you can easily serve retina images to it, and if not you can serve the normal resolution non-retina images.

@deviceWidth - Contains the full width of the device, including the UI taskbars. Using the device width you can choose whether to hide or show specific elements on your page, change the style of an element etc.

@deviceHeight - Contains the full height of the device, including the UI taskbars. Using the device height you can choose whether to hide or show specific elements on your page, change the style of an element etc.

 

@viewportWidth - Contains the width of the device without the UI taskbars. Using the view-port width you can choose whether to hide or show specific elements on your page, change the style of an element etc.

@viewportHeight - Contains the height of the device without the UI taskbars. Using the view-port height you can choose whether to hide or show specific elements on your page, change the style of an element etc.

 

@documentWidth - Contains the width of the document.

@documentHeight - Contains the height of the document. It's particularly useful for scrolling apps.

 

@orientation - Contains the orientation change from landscape to portrait mode and vice versa. Using the orientation you can check the orientation of the device and change an element style, class, etc - for example, you can show a background image that is portrait-optimized or landscape-optimized.

Requirements

Type: Behavior
License: External link
Product: Dreamweaver CS3, Dreamweaver CS4, Dreamweaver CS5/CS5.5 and CS6, Dreamweaver CC+
Used Technologies: jQuery
Screen Shot: External link
Required Extensions: HTML5 Data Bindings

History

Version 1.1.0

  • Full compatibility with the upcoming Dreamweaver CC 2017 dark theme 

Version 1.0.1

  • Improved compatibility with Dreamweaver CC 2015

George Petrov

George PetrovGeorge Petrov is a renowned software writer and developer whose extensive skills brought numerous extensions, articles and knowledge to the DMXzone- the online community for professional Adobe Dreamweaver users. The most popular for its over high-quality Dreamweaver extensions and templates.

George is also the founder of Wappler.io - the most Advanced Web & App Builder

See All Postings From George Petrov >>

Reviews

Be the first to write a review

You must me logged in to write a review.