Colio jQuery Portfolio Content Expander Plugin

CodeCanyon Colio jQuery Portfolio Content Expander Plugin 6507310
Script \ JavaScript \ Images and Media
Portfolio \ Content \ Inside \ Placement \ Viewport \ Resize \ Isotope \ Update

JavaScript - Colio jQuery Portfolio Content Expander Plugin 6507310 by flGravity @ CodeCanyon

Script \ JavaScript \ Images and Media

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!


- 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


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

Last Update: 26 September 14; High Resolution: Yes; Compatible Browsers: IE8, IE9, IE10, IE11, Firefox, Safari, Opera, Chrome; Files Included: JavaScript JS, HTML, CSS, Layered PNG; Software Version: jQuery.

PayNow! - jQuery PayPal Plugin; Colio - Responsive Portfolio Wordpress Plugin; Seria - jQuery Slideshow Plugin; Everslider - Responsive WordPress Carousel Plugin; Everslider - Responsive jQuery Carousel Plugin; Backslider - Fullscreen Background Image Slider; RollBar - jQuery ScrollBar Plugin.

Keywords: ajax, black, content, details, expander, grid, inside, one page, portfolio, preview, showcase, slide down, viewer, white.