Back to Top
The nuts and bolts for
Creative web development

HTML5 Image Enhancer

“Stunning Real-time Animation Effects, Gradients, Image Filters and Transitions!”

Bring your images to another level with the HTML5 Image Enhancer. Create real-time animation effects, reflections, gradients, image filters and transition with only few clicks and without any Flash! Add customizable borders with rounded corners and gradient colors, shadows, and even switch filters on mouse over.

You don't have an HTML5 compatible browser like Internet Explorer? - don't worry we have made a special fall back method, that will use Flash on browsers that do not support the HTML5 Canvas element to achieve the same fantastic results!

Features

  • The HTML5 Image Enhancer is fully responsive - The images will scale depending on your browser resolution and available space!
  • Amazing Effects with Canvas and jQuery – No Flash required!




  • Give your image a cool Web 2.0 look with reflections – HTML5 Image Enhancer automatically generates amazing reflections.
     

  • Customizable Borders and Gradients - Add fantastic colorful borders with gradients to your images to get the perfect look.


     

  • Transition Animation – You can display the hoover effects with nice transition animation.
      


  • Switch image filters on mouse over with transition animation - You can also use drop shadow with different colors, size and blur effect.



  • Description - Give your users additional information about your images and can automatically slide in onMouseOver.



  • HTML5 Image Enhancer can be used on iDevices like iPad and iPhone - Take advantage of the build in hardware acceleration and give you the maximum performance and greatest experience.

  • You don't have an HTML5 compatible browser like Internet Explorer? - don't worry we have made a special fall back method, that will use Flash on browsers that do not support the HTML5 Canvas element to achieve the same fantastic results!
  • Apply to multiple images with Global CSS Selectors



     
  • Dynamic from Recordset - Set the site with a server type (PHP, ASP-VB, ASP-JS etc.) and create a database that will serve as a source for your images, width/height and text. Options for min. and max. width for optimal usage of responsive images.


     
  • Fully cross browser compatible - The HTML5 Image Enhancer  is a jQuery based, build only with HTML & CSS - no Flash what so ever! It even supports IE6 next to the other major browsers.

  • Search engine friendly – The HTML5 Image Enhancer is pure HTML and CSS based and generates search engine friendly HTML code that can be nicely indexed by all search engines and web spiders.


  • Great Dreamweaver Integration - Interactive dialog in Dreamweaver with all the options you’ll need.


  • An inline property inspector so that you can easily change visual options later on.


  • Full Support for the DMXzone Behavior Connector - You can easily bind other DMXzone extensions such as Sliding Billboard, DMXzone Lightbox and Sliding Panels that can be controlled through the Behavior Connector.


Showcases


  • Restaurant Daily Menu Showcase

    This is another showcase where we used Responsive Bootstrap 3 Portfolio Template and turned it into a restaurant menu page with great image effects on mouse over.

  • Home Design Store Showcase

    For this showcase we used DMXzone Bootstrap 3 to design the completely responsive page layout. Also we used HTML5 Image Enhancer in order to add beautiful effects to the images. In our case we used ...

  • Responsive Bootstrap 3 Portfolio Showcase

    This showcase has been created with the Responsive Bootstrap 3 Portfolio, DMXzone Bootstrap 3 to be fully responsive, HTML5 Image Enhancer for the amazing gray scale image effects, and DMXzone ...

  • Racing League Showcase

    For this showcase we used DMXzone Bootstrap for the page layout and HTML5 Image Enhancer tint filter for the images effects on hover. We also styled the application form with DMXzone Uniform to look ...

  • Swimming Pools and Services Showcase

    For this showcase we used DMXzone Bootstrap to create the page layout and HTML5 Image Enhancer for the effects that are triggered when you hover an image thumbnail.

  • Restaurant Menu Showcase

    For this showcase we used one free and two commercial DMXzone extensions to create one page restaurant menu with great effects and responsive layout and text. For the welcome text in the header we ...

  • Interior Design Company Showcase

    For this showcase we used the Universal Responsive Bootstrap Template that features the DMXzone Bootstrap tool for the design layout, HTML5 Image Enhancer for the images effects on mouse over and ...

  • Urban Architecture Showcase

    For this showcase we used the DMXzone Bootstrap for the fully responsive design and the HTML5 Image Enhancer to add awesome effects to the images thumbnails. for that purpose we used the tint effect, ...

  • Furniture Store Showcase

    For this product page showcase we used 5 DMXzone extensions to complete it and make it fully functional. the discounted items are presented in a HTML5 Parallax Slider with button navigation. The ...

  • Metro Design Showcase

    For this showcase we used 4 awesome Dreamweaver extension in order to create a Metro design. It contains DMXzone Tabs with animated content (Advanced CSS Animator), which are customized with the ...

  • Metro UI Hotel Website Showcase

    For this showcase we used the Metro UI Design Template's home page, which features the DMXzone Supersized for the sliding background images, the DMXzone Calendar 2 for the reservation form and the ...

  • Organic Food Showcase

    For this showcase we used the HTML5 Image Enhancer in order to give our images a little boost. We rounded the corners through the border radius option and added on hoover effects.

  • Design Studio Showcase

    For this showcase we used two DMXzone extensions - the HTML5 Parallax Slider and the HTML5 Image Enhancer. With the first we made a slideshow with 3 slides and added different images and texts which ...

  • Photographer Portfolio Showcase

    For this showcase we worked with 3 DMXzone extensions. The menu was built with the Fish Eye Menu. Below we have various images, on which we used the HTML5 Image Enhancer to give them reflections and ...

  • Responsive Image Enhancement Showcase

    For this showcase we used HTML5 Image Enhancer 2.0.0 to improve the images performance with great effects on hover in a responsive environment. We added tint filter and text as well as animation.

  • Online Image Upload Showcase

    We used the Pure ASP Upload Add-on Pack that features the Rename uploaded files server behavior to rename the uploaded files (Pure ASP Upload 3) in a very flexible way. Using the free Universal CSS ...

  • Golf Club Showcase

    In this showcase you can see an extremely easy but yet really effective way to present your place with amazing pictures that will stun your users. The image slider is created with DMXzone ...

  • Restaurant & Bar Showcase

    For this showcase web site there were only 3 extensions used. The slider is created with the updated HTML5 Slideshow that changes the images, Universal CSS Navigation Menu to navigate through the ...

  • Facebook Hot Offers Tab Showcase

    In this showcase is designed as a Facebook Fan Page Tab and you can see how amazingly you can present your products in a fantastic HTML5 Slideshow. The thumbnail images are navigate the slideshow ...

  • Facebook Fan Page Showcase

    In this showcase is designed as a Facebook Fan Page Tab and you can see how amazingly you can present your products in a fantastic HTML5 Slideshow. The thumbnail images are navigate the slideshow ...

  • Enhanced Sliding Billboard

    Each image in the Sliding Billboard is enhanced with a sepia and blur image filter with the help of HTML5 Image Enhancer.

  • 3D Space Objects Gallery

    Each image in the gallery is enhanced with a sepia image filter, gradient and reflection.

  • Logistic Website Showcase

    This design is created with our amazing Universal CSS Navigation Menu, HTML5 Image Enhancer, Advanced HTML Editor 3 and Online Page Editor Add-on! Please note that the use of the Online Page Editor ...

  • Skatepark Showcase

    The showcase has been created with HTML5 Slideshow, which slide your pictures with description possibilities, the customized Universal CSS Navigation Menu is taking care of the top navigation and the ...

  • HTML5 Image Enhancer & Universal CSS Navigation Menu Showcase

    The page contains a customized Universal CSS Navigation Menu, which also has supplied designs in it, and enhanced images with titles with the help of HTML5 Image Enhancer.

  • HTML5 Image Enhancer & Lightbox Showcase

    In this showcase you can see how to combine HMTL5 Image Enhancer, in order to improve the look of your images, with DMXzone Lightbox, so that you can present them in a great popup window.

  • HTML5 Image Enhancer & Lightbox Showcase

    In this showcase you can see how to combine HMTL5 Image Enhancer, in order to improve the look of your images, with DMXzone Lightbox, so that you can present them in a great popup window.

  • The Frog Showcase

    A cool showcase of the Blur filter with Reflection.

  • Designs and Effects Showcase

    In this showcase you will be able to explore the borders, shadows, reflections and filters packed in the HTML5 Image Enhancer extension.

  • Fashion Website

    This website home page has been designed with the help of Universal CSS Navigation Menu , HTML5 Slideshow and HTML5 Image Enhancer. All extensions can be viewed in our Extensions section.

  • Hotel Template

    The design is created with some of the finest DMXzone extension: HTML5 Slideshow, Universal CSS Navigation Menu, Sliding Panels, DMXzone Calendar and HTML5 Image Enhancer. You can download this ...

  • Building an Interior Design Page

    As you might already noticed we've been publishing some amazing showcases recently, using DMXzone extensions. Now it's time to pack all the needed files and share them with the world. All Templates ...

  • Photography Website Showcase

    In this showcase we binded Feed Genie and DMXzone Supersized so you can search for images in Picasa. Also you can connect your Picasa/Flickr account directly to use it as a source for your DMXzone ...

  • Flickr and Picasa combined feeds

    In this showcase you will be able to experience two feeds from Flickr and Picasa combined on one page.

  • Feed Genie Preview Showcase

    In this showcase we've used the YouTube Video Search feed, where you can filter YouTube videos from the search field and choose which one to be displayed. We've also used HTML5 Image Enhancer in ...

Videos

HTML5 Slideshow Video

HTML5 Image Enhancer Overview, presented by Brian Wood
The video is a feature overview of the HTML5 Image Enhancer extension, presented by Brian Wood.

Applying a nice Spin-in effect to HTML5 Slideshow
With this movie we will show you how to apply a nice Spin-in effect to HTML5 Slideshow using one of the Advanced CSS Animator predefined animation presets.

Requirements

Type: Behavior
License: External link
Product: Dreamweaver 8, Dreamweaver CS3, Dreamweaver CS4, Dreamweaver CS5/CS5.5 and CS6, Dreamweaver CC
Platform: Win XP/2000/2003/2008/7, Mac OS X
Browser: Safari 2.0, IE 7, Firefox 3.6+, Opera 9.5, Safari 3, Chrome 9+, IE 8, Safari 4+, iPad
Screen Shot: External link
Tags: HTML5, Image Enhancer, Dreamweaver, extension


History

Version 2.1.0

  • Improved HTML5 Image Enhancer responsiveness
  • Full support for DMXzone Bootstrap 3
  • Included latest jQuery 1.10.2

Version 2.0.2

  • Full Dreamweaver CC and Extension Manager CC support
  • Included new Behavior Connector with restyled UI and better Mac OSX Support
  • Updated the automatic file copy and update component for better Dreamweaver CC support
  • Improved compatibility with the latest jQuery
  • Included latest jQuery 1.10.1
  • Improved Windows 8 compatibility

Version 2.0.1

  • Improved integrations with other extensions like HTML5 Parallax Slider
  • Improved effects speed and responsiveness in IE
  • Improved IE Flash fallback for older IE versions
  • Improved embedding HTML5 Image Enhancer in various HTML containers with own backgrounds
  • Included updated jQuery to 1.8.3

Version 2.0.0

  • The HTML5 Image Enhancer is now fully responsive - The images will scale depending on your browser resolution and available space!
  • 4 new image filters included - Filters for saturation, brightness, contrast and gamma to give your images even greater effects!
  • New options for min. and max. width for optimal usage of responsive images
  • Responsive rounded corners - You can add percent value for responsive images
  • Improved design view in Dreamweaver for responsive images
  • Improved Dreamweaver UI and integration
  • Improved source file compression for smaller files and faster loading
  • Greatly optimized image filters performance! Now the filters are applied much faster to provide even greater user experience!
  • Improved installer for DW CS 5.5+ and Mac DW CS6

Version 1.0.6

  • Fixed incorrect sizes for flash object in Internet Explorer 8 and lower
  • Fixed missing font type name and align when used with global selectors
  • All options in Dreamweaver now generate valid JSON config
  • Optimized source code

Version 1.0.5

  • Improved compatibility with newest jQuery 1.6+ versions
  • Included latest jQuery 1.6.3
  • Optimized source and files for smaller size
  • Improved automatic shared file copy, synchronization and upload from Dreamweaver
  • Improved working in Dreamweaver templates

Version 1.0.4

  • Improved Dynamic Data input
  • Allow transparent colors in color pickers
  • Included new jQuery 1.4.4
  • Improved depended file includes

Version 1.0.3

  • New Full Spry support! Now you can have your HTML5 enhanced images in a dynamic Spry repeat regions!
  • Optimized image loading from local and external domains
  • Optimized image preloader

Version 1.0.2

  • Improved Flash control for IE. Now rendering images from different domains as well
  • Improved encoding when rendering images through Flash
  • Added possibility to apply image effects even on images from other domains

Version 1.0.1

  • Improvements with the behavior connector events
  • Descriptions and filters fully working in Flash (for the IE fallback)

Update Procedure:

Just open a page using the HTML5 Image Enhancer. You will see a progress bar indicating new files are being copied. After that a dialog will popup with the list of the new files. Depending on if you have remote site defined and you have site synchronization enabled, the files will be automatically synchronized or you will be presented an option to upload all files.

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. 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.

See All Postings From George Petrov >>

Share this Article