HTML5 3D Flipping Gallery is the perfect solution if you are looking for to create a polaroid-like image gallery. It features CSS 3D transforms for native 3D in browsers that support the new CSS properties. You can drag your images all over the screen, give them titles and add descriptions. Take advantage of the built in hardware acceleration for mobile devices that gives you the maximum performance and greatest experience.
The HTML5 3D Flipping Gallery has integrated DMXzone Image Resizer and also you can set the width and height for the gallery container, set the rotation for the images and their order of appearance. When it comes to the image source you can use static or dynamic sources.The integrated behavior connector will help you combine the gallery with other extensions such as DMXzone Lightbox, Feed Genie and more.
Overview
Features Highlights:
- Amazing Flip effects -Choose the flip effect to be triggered on hover or on mouse click, as well as the type of flip effect, direction, rotation angle and the depth of 3D perspective.
- Shuffle and randomize images - Randomize the order of the images and shuffle them among the gallery container.
- Fully draggable gallery - You can drag your images all over the screen.
- Title and description for each image - A cool title and description can be displayed as additional image info. You can also use various HTML tags such as link, image, span, heading, div and more...
- CSS 3D Transforms for native 3D in the browsers - The flip and zoom effect do not execute in browsers that don’t support the new CSS properties.
- CSS3 Transforms on mobile devices - Take advantage of the built in hardware acceleration that gives you the maximum performance and greatest experience.
* For complete Features overview press the Features in Detail
Features
- Amazing Flip effects
-Choose the flip effect to be triggered on hover or on mouse click, as
well as the type of flip effect, direction, rotation angle and the depth
of 3D perspective.
- Shuffle and randomize images - Randomize the order of the images and shuffle them among the gallery container.
- CSS 3D Transforms for native 3D in the browsers - The flip and zoom effect do not execute in browsers that don’t support the new CSS properties.
- CSS3 Transforms on mobile devices - Take advantage of the built in hardware acceleration that gives you the maximum performance and greatest experience.
- Fully draggable gallery - You can drag your images all over the screen.
- Title and description for each image - A cool title and description can be displayed as additional image info. You can also use various HTML tags such as link, image, span, heading, div and more...
- Add clickable links to your gallery - You can add link to every image of you gallery in its description.
- Timed transitions on zoom - You can specify the duration of the zoom transition.
- Gallery width and height - Set the size of the container where the HTML5 3D Flipping Gallery will be placed in.
- Dynamic HTML5 3D Flipping galleries - You can make galleries directly from dynamic sources like a Recordset and an RSS/ATOM Feed fetched with Feed Genie ASP/PHP. By combining HTML5 3D Flipping Gallery with Feed Genie ASP/PHP, you can make galleries directly from your Picasa / Flickr Photo Albums! Or just choose the featured photos!
- Live preview of the gallery in Dreamweaver - With a single click on the Live button you can see a preview of your complete gallery.
- Integrated DMXzone Resizer - Now resizing all your images super fast to a regular size for the gallery and bigger size for display the image in DMXzone Lightbox.
- Great Dreamweaver Integration - Interactive dialog in Dreamweaver with all the options you’ll need.
- An inline property inspector - The property inspector enables you to change several options after you’ve created the gallery.
- Full Support for the DMXzone Behavior Connector - You can easily bind other DMXzone extensions like DMXzone Lightbox and Feed Genie to your gallery.
- Full IE10 CSS 3D flipping support - As IE10 now finally supports the CSS
3D Transforms web standard the extension takes full
advantage of it!
- Search Engine Friendly - HTML5 3D Flipping Gallery is made with just HTML5, CSS3 and jQuery and is nicely indexed by all search engines and web spiders.
Showcases
-
3D Flipping Gallery with Upload
For this showcase page we used the Pure PHP Upload 3 as an image upload solution for the HTML5 3D Flipping Gallery. On upload, the images get resized, cropped and watermarked with the help of Smart ...
-
Online Flowershop Showcase
For this flower delivery service we used the HTML5 3D Flipping Gallery to present the images of the different bouquets that flip on click with some additional information on the back. The date and ...
-
3D Flipping Gallery within a Parallax Slider Showcase
In this showcase we added four HTML5 3D Flipping Galleries as elements in the HTML5 Parallax Slider in order to design even greater 3D depth illusion. Also we added DMXzone Accordion on the right ...
-
Harry Potter Showcase
For this showcase we play a little bit with the CSS of HTML5 3D Flipping Gallery in order to create this awesome Harry Potter fan page. It contains 7 HTML5 3D Flipping Galleries for the different ...
-
Travel Blog Showcase
In this showcase we used the HTML5 Flipping Gallery in order to create a travel blog article that lists the top travel destinations for 2013. When clicked, each of the images flips and shows ...
-
Restaurant Coming Soon Showcase
We made a simple page and added a background image to it with the DMXzone Supersized extension. Using the HTML5 3D Flipping Gallery we put out three images which are set to flip on click. On the back ...
-
Spa Hotel Showcase
For this showcase we used our DMXzone Nivo Slider extension to create an image slider with different transitions effects. Below we have four images that show some parts of the hotel. With the HTML5 ...
-
Cars For Sale Showcase
In this showcase we used our Universal CSS Navigation Menu in order to create the menu. With the HTML5 3D Flipping Gallery we created an image gallery. For the description on the back we used img ...
-
Features Highlight Showcase
For this showcase we added 2 HTML5 3D Flipping Galleries with 2 images each and description about the features. Two flip on the right and the other two on the left.
-
HTML5 3D Flipping Gallery Store Showcase
For this showcase page we used HTML5 3D Flipping Gallery in order to create a flipping image for the selected product. The trigger is on click and the flip direction is set to right. On the back we ...
-
Shoes Store Showcase
For this showcase we used our HTML5 3D Flipping Gallery in order to create an image gallery. The images are set to flip on click and the direction is set to bottom. The order is put-up to random. ...
-
Beach Hotel Showcase
For this showcase we used DMXzone Lightbox in order to show a larger preview of the images in the HTML5 3D Flipping Gallery. Once an image is clicked the lightbox opens automatically.
-
Real Estate Agent Showcase
For this showcase we created a simple gallery with images that flips on mouse click and which can be dragged across your screen. Also the images have description on the back for an awesome post ...
Videos
Random Images with HTML5 3D Flipping Gallery
Using HTML5 3D Flipping Gallery with Facebook Fan Page
Using Feed Genie with HTML5 3D Flipping Gallery
Using HTML5 3D Flipping Gallery with DMXzone Lightbox
Dynamic HTML5 3D Flipping Gallery
Using HTML5 3D Flipping Gallery
Requirements
History
Version 1.0.2
- New Shuffle method - Now you can choose between Uniform shuffle that stacks the images randomly in a certain realm or the Jittered one that spreads them across the whole gallery area.
Version 1.0.1
- Full IE10 CSS 3D flipping support! As IE10 now finally supports the CSS 3D Transforms web standard we have improved the extension to take full advantage of it!
- Improved links on mobile devices
- Improved installer for Dreamweaver CS 6.1 (Adobe Creative Cloud) compatibility
George 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. His expertise in countless languages and technologies gives inspiration and teach valuable lessons on his website – DMXzone.com, which is visited daily by more than 30.000 people and is most popular for its over high-quality Dreamweaver extensions and templates.
