Colio - jQuery Portfolio Content Expander Plugin

Responsive Portfolio Content Expander Plugin with Black & White Theme

The idea of Colio – jQuery Portfolio Content Expander Plugin is to display details about your portfolio items on the same page in form of expandable viewport that can show up above, below or inside your portfolio grid. Colio includes black and white theme for quick start and can be easily integrated in existing portfolio. Also it’s compatible with popular filtering plugins like isotope and quicksand and works on tablets and mobile devices!

Features

• Responsive
• Mobile optimized
• Includes black and white theme
• Different placement options & dynamic inside placement
• Inline or AJAX content
• Content filters and callbacks
• Easy integration in existing portfolio
• Compatible with isotope and quicksand plugins
• Scroll to view feature
• Retina-ready navigation
• Valid markup
• JSHint compliant code
• Detailed install instructions

Update to version 1.1 (Feb 02, 2014)

- fixed problem when css "top" position was not explicitly set to pixel value for portfolio items in style.css ("inside" placement) - fixed problem with the whitespace appearing below portfolio list when opening next item without closing previous one ("inside" placement)

Update to version 1.2 (Apr 30, 2014)

- added new option “scrollPage” to enable/disable auto scroll to colio viewport - now auto page scroll will be blocked when you resize window with opened viewport - to support dynamic content inside viewport, you can trigger resize by sending $('.colio').resize() event and be sure no other listeners will run

Update to version 1.3 (May 02, 2014)

- in "inside" placement mode to force Colio viewport to reflow for dynamic content you should use "orientationchange" event. For any other placement both "resize" or "orientationchange" events will work - in "inside" placement mode onCollapse() callback will be executed immediately when window is resized and viewport is collapsed - fixed small problem with isotope plugin and "inside" placement mode

Update to version 1.4 (Sep 25, 2014)

- to target specific element in content loaded via AJAX you can append #element selector right to the URL in "data-content" attribute - changed code related to "contentFilter" plugin option

Update to version 1.5 (Jul 24, 2015)

- added new option "beforeLastRow" that can place viewport underneath last row of items in "inside" placement mode - fixed bug when sometimes in "inside" placement mode viewport was covering items in grid

Credits

Following plugins have been used in preview – Isotope, Quicksand, Fancybox, Flexslider

CUSTOMIZATION & REMOTE WORK

I’m available also for remote work! So if you need to modify the plugin (add extra features or change existing) feel free to contact me via the comments or via my website’s Contact Form. Also I can help to install my plugin or customize it to match your website design.