DMXzone Cyber Monday with 30% discount starts now! Use promo code: DMXCM15
Dynamic Fullscreen Gallery with Bullet Navigation
August 28, 2014 by Lubov Cholakova

In our latest showcase we created an awesome dynamic, fullscreen gallery using our latest released extensions. We built up the gallery, with images from a local JSON file, and paging(bullets) navigation using HTML5 Data Bindings and HTML5 Data Bindings Extended Repeater. Using HTML5 Data Bindings Browser Properties we set the width and height of the gallery to match the width and height of the browser viewport. We also used orientation check. When a user loads the page into a portrait-oriented device, a message is being displayed - "Please use your device in landscape orientation". Additionally, HTML5 Animate CSS is used for the fade effect when an image is changed.

Mentioned Extensions
HTML5 Animate CSS
Design – Just-add-water CSS animations
HTML5 Data Bindings
Databases – Design interactive, data driven dynamic web sites and apps
HTML5 Data Bindings Browser Properties
Databases – Rich information about the browser and device your visitor is using
HTML5 Data Bindings Extended Repeater
Databases – Powerful repeat regions

Lubov Cholakova

Lubov CholakovaLubov has been with DMXzone for 7 years now, contributing the Content department. She is bringing high quality content in the form of daily blog updates, reviews, tutorials, news, newsletters,update emails and extensions' manuals. If you have a product that needs publicity or any other questions about the entire DMXzone community, she is the one you can contact.

See All Postings From Lubov Cholakova >>

Place your comment about Dynamic Fullscreen Gallery with Bullet Navigation

You must me logged in to write a comment

Be the first to place a comment