Menu

Image Gallery - CoverFlow

XMod Pro Image Gallery - CoverFlow

XMod Pro Module Kit - jQuery UI CoverFlow Image Gallery

As an example kit to show off the flexibility of XMod Pro templates when creating module items for DotNetNuke like an image slider, image gallery or slideshow, we have put together an example using our example data set and the popular jQuery image slider, jQuery UI CoverFlow 2.0 From Addy Osmani
 
Module Description & Uses: CoverFlow is built as a quick way to create an iTunes-like CoverFlow effect or cover flow/flip type of presentation. It can be used to show display any type of image gallery or can be used for the selection of detail records or as visual navigation for records that have strong images/visuals involved. There is no fixed limit to the number of images in the slideshow, as it will add icons/slides for every image returned in the recordset. Use this as a base code to create your own customized module or use it as a resource for tips and tricks for building your own XMod Pro solution!
 

 
XMod Pro Module Kits

XMod Pro Module Kits: Notes & Instructions

  • XMod Pro demos and XMod Pro Module Kits are free for everyone to use! We have developed them to help share popular items and to help train users in the features and functionality of XMod Pro for creating custom module solutions for DotNetNuke!
  • This kit utilizes code and files from the jQuery UI CoverFlow jQuery image slider gallery from http://addyosmani.com/blog/jqueryuicoverflow/.
  • To utilize this XMod Pro demo, simply download the Module Kit from the DNNDev Downloads section. Once you've downloaded the file, install it as you would any DNN module. Next, add the kit module to a page. Finally, click the module's "Finish Installation" button to complete the process. The result will be an XMod Pro module instance, configured to use the kits forms, templates, and feeds as needed.
  • The main slider bar is styled with the jQuery UI, so you can easily switch to different themes in the code or create your own. You may also download the full js/css/images from the source at addyosmani.com. Also, the version we've setup for XMod Pro only shows the images and slider control, you can work with the original code to also have a title list of items below the slider, and more effects and features.
  • Change the display, text and links easily to other custom tables or data of images from other modules.
  • For demo purposes, initial templates are set to reference the sample images stored on the DNNDev site. When ready to use, follow instructions in the code and edit the code (and feed) files to reference your DotNetNuke instance
  • The jQuery involved with SlidesJS is compatible with all modern web browsers and with jQuery versions 1.4.4+ and jQuery UI 1.8.6+.
  • This XMod Pro Module Kit features an XMP Template for layout, and an XMP Form displayed in editor view.