WorldWideScripts.net Delivering the best Add-Ons in more than 37 languages.

中文(简体), English, हिन्दी/हिंदी, Español/Castellano, العربية, Русский язык, Français, 中文 (台灣), বাংলা, Bahasa Indonesia, اردو, Português, Deutsch, Bahasa Melayu (بهاس ملايو‎), 日本語 (にほんご), فارسی, Italiano, తెలుగు, Türkçe, ગુજરાતી, Język polski/polszczyzna, Tiếng Việt, ಕನ್ನಡ, Українська мова, ไทย
JavaScript / Images and Media

Grid Accordion - Responsive and Touch-enabled grid

— Add-On to WorldWideScripts.net

Subscribe to our feed to stay up to date!

New! Follow us as you want it!


Grid Accordion - Responsive and Touch-Enabled Grid - CodeCanyon Item for Sale

Ads

Ad: Bluehost hosting

Word Press version available

Grid Accordion combines the functionality of a grid gallery and an accordion slider, offering you an interesting method to display your portfolio.

For Designers

  • Fully responsive – the grid is responsive out of the box and provides 2 responsive modes: auto and custom
  • Touch-enabled – supports touch swipe gestures on touch-screen devices and mouse drag on the desktop
  • Customizable rows and columns – you can change the number of rows and/or columns in the grid based on the screen’s size
  • Layers – Grid Accordion supports animated and static layers that can hold any content: from simple text to videos
  • Image Swap – it’s possible to swap the background image when the panel opens
  • Retina-ready – the accordion supports alternative, high-resolution images for screens with high PPI, like the Retina display
  • Lazy-loading – the images will be loaded only they are in the visible area
  • Deep-linking – it’s possible to open a panel from a link, whether the link is in the same page or in another page
  • Keyboard navigation – it’s possible to navigate through the grid accordion (panel by panel or page by page) using the keyboard
  • Automatic video control – integration with YouTube, Vimeo, HTML5 video, Sublime Video and Video.js
  • SEO-friendly
  • XML and JSON support

For Developers

  • Modular architecture – the plugin consist of several modules and you can build your own script, containing only the features you will be using
  • CSS3 transitions and RequestAnimationFrame – modern animation techniques are used in order to provide smooth animations
  • Powerful API – Grid Accordion provides multiple public method and callback functions, and also the possibility to change the properties on runtime

You can read more about the above features and see them in action here.

If you have any questions or need assistance integrating the accordion, please feel free to ask; I will gladly help you. Also, if you like this script, please take a moment to rate it :) Most of the buyers give this script 5 stars but if you plan to rate it lower than 5 stars I would really appreciate if you contact me first with your suggestions/complaints; maybe I can resolve those issues :) Thank you!

Get Free Support Visit our support center for assistance and other queries Follow CodeCanyon Follow Twitter

Changelog

 v. 2.5 ( 28 February 15 ) * fix hidden background when fadeOutBackground is enabled * fix non-responsive bug * improve touch swipe support on touch-enabled desktop browsers v 2.4.1 ( 12 December 14 ) * some bug fixes v 2.4 ( 5 November 14 ) * add shuffle option * various fixes and improvements v 2.3 (1 May 14) * fixed background image swap when startPanel is used * added the 'ga-closed' class by default when the accordion is initially closed * fixed the 'ga-opened' class removal from the last opened panel * added 0 margin and padding to background images to prevent unwanted styling v 2.2 (6 April 2014) * fixed non-responsive mode * fixed removal of ga-opened class * fixed link support when 'openPanelOn' is set to 'click' * fixed touch-swipe support when 'openPanelOn' is set to 'click' * added 'never' option for 'openPanelOn' * added bottom margin to accordion when buttons are present * simplified selectors in the CSS code * improved support for inner HTML content * added support for no-js class * added preset font sizes for layers * added CSS code that prevents unwanted CSS inheritance v 2.1 (14 November 2013) * added keyboardTarget property * corrected documentation typos v 2.0 (8 November 2013) * rewritten the entire code and implemented a modular architecture * added many new features, like responsiveness, touch swipe, animated layers, retina support, lazy-loading, pagination, automatic video control, etc. v 1.2 (10 January 2012) * updated the jQuery library to the latest version v 1.1 (15 December 2010) * added the possibility to have both landscape and portrait images in the same grid v 1.0 (29 November 2010) * first release 

Download
Other components in this categoryAll components of this author
CommentsFrequently asked questions and answers

Properties

Created:
29 November 10

Last Update:
28 February 15

High Resolution:
Yes

Compatible Browsers:
IE7, IE8, IE9, IE10, IE11, Firefox, Safari, Opera, Chrome

Files Included:
JavaScript JS, HTML, CSS

Software Version:
jQuery

Keywords

eCommerce, All Items, accordion gallery, animated layers, grid accordion, modular, responsive accordion, responsive grid, retina, thumbnail grid, touch swipe, video