Picture Gallery Premium jQuery Plugin
Create your distinctive inventive spectacular gallery to your pictures with number of stunning animated hover results, utilizing templates and examples, colour schemes, svg and canvas picture filters and different instruments!
is a multipurpose horizontal masonry grid constructing resolution:
- low-level suport of Flickr API
- robust reminiscence saving algorithm
- good for cell units
- templating instruments with many choices
- 2 retina modes
- built-in lightbox with retina assist
- high-level assist of PhotoSwipe, ColorBox, PrettyPhoto
- works both with json or html codecs (customized parsers)
- built-in assist for canvas and svg filters
is a set of 34 stunning templates:
- stunning distinctive design
- greyscale and sepia results
- spectacular animated hover results
- mouse hover impact simulation for cell units
- greater than 100 well-commented examples
Greatest for Cellular Units
Hover impact simulation
Often there are two methods for arranging ‘hover’ impact on cell units: you possibly can ignore it (first) or you should utilize buttons (second).
I counsel the third method: simulation of a ‘hover’ impact after the primary touching an icon. After the second touching a ‘click on’ occasion is simulated.
This strategy is totally realized within the Grand Pack.
After all, You’ll be able to abandon this strategy by simplifying of an acceptable template.
It’s apparent, that the grid opened on cell units will differ from the grid opened on the PC. So Moon Mega Grid provides the likelihood to make totally different templates for PC and for cell units.
As a result of reminiscence optimization Moon Mega Grid provides the likelihood to indicate as much as a number of thousand objects on one web page. Even when you’ve got thousand objects in your machine, crash is hardly to occur in the event you rotated the display screen and the view was rebuilt.
There are 2 Retina modes:
- The width and the peak of the merchandise can be a half of the native sizes, regardless whether or not the machine has received Retina display screen or not.
- In case your machine doesn’t have Retina display screen the src will keep unchanged. But when it’s a Retina machine, the src attribute can be modified and ’@2x’ suffix can be inserted earlier than the file extension.
After all, you possibly can swap off Retina mode in any respect.
Sturdy Reminiscence Optimization
Often grids eat sources. There are lots of DOM components. Thera are heavy photographs.
Moon Mega Grid is predicated on ideas, which permit reduce the talked about above results:
- All info isn’t saved in DOM-structure however within the particular object.
- All objects which aren’t on the display screen in the meanwhile are faraway from the DOM.
Due to which you can place as much as a number of hundreds photographs on one web page even whereas utilizing units with Retina display screen and picture filters.
Grand Pack: 34 inventive templates
It’s an unprecedented set of great templates with unique animated captions.
Each template has been examined on varied cell units and simulates the ‘hover’ impact for them.
Many templates give chance to decide on a colour schema.
All SVG-filters are supported. They are going to add artistry to your web page.
Moon Mega Grid has its personal small library for canvas filtering.
The checklist of supported canvas filters: grayscale, sepia, colorize, distinction, saturate, vibrance, noise, brightness.
You should utilize mixture of canvas filters.
In most circumstances SVG-filters are preferable as a result of they’re quicker.
From the opposite aspect, canvas filters works properly on previous variations of Android. IE8, IE9 assist them too.
You’ll be able to set Moon Mega Grid to make use of SVG-filters in browsers which assist SVG-filters. In any other case the browser will use canvas filters.
There’s one other chance for IE8, IE9: you should utilize native MS-filters.
You’ll be able to create your individual templates or modify templates from Grand Pack.
Template object features a markup string and a callback operate.
It might embody further objects of templates for cell units, IE9 and IE8, IE8.
The template instrument is predicated on the Underscore.js template operate.
Customized templates could be saved in separate recordsdata.
Code High quality
Initially the entire script was written on CoffeeScript that ensures a excessive degree of code high quality.
Supply recordsdata embody CoffeeScript recordsdata, structured by courses, in addition to much less recordsdata and css recordsdata.
Each template of the Grand Pack has its personal folder.
22 July, 2016
Moon Mega Grid v2.eight:
- new chance so as to add customized swipe parameters to the lightbox
- added the loader object that lets builders to look at the method of photographs loading
- fastened a bug in ie8 for the lightbox
29 June, 2016
Moon Mega Grid v2.7:
- Added new performance to the LightboxSwipe class
23 June, 2016
Moon Mega Grid v2.6:
- Added the brand new performance to the LightboxSwipe class
- Mounted some bugs
9 June, 2016
Moon Mega Grid v2.5:
- Added the brand new LightboxSwipe class
- Mounted some bugs
Grand Pack v1.four: Made modifications in accordance with new Moon Mega Grid ver. 2.5
6 Could, 2016
Moon Mega Grid v2.four:
- Mounted a bug within the Lightbox
- Added the ‘jsonParser’ callback operate
- Added 5 examples of low-level integration with Flickr API
Grand Pack v1.three: Mounted a bug within the Gentle template
19 April, 2016
Moon Mega Grid v2.three:
- Added high-level assist for ColorBox, PrettyBox, PhotoSwipe
- Added some modifications into the built-in lightbox
- Added the ‘afterLoad’ occasion
- Added the general public ‘getExternalLightbox’ technique
four April, 2016
Moon Mega Grid v2.2: Bug fastened. New instance.
31 March, 2016
Moon Mega Grid v2.1: The manufacturing facility operate was added that can be utilized as an alternative of the constructor
Grand Pack v1.2: All templates have been modified so as to add this new performance
5 February, 2016
Grand Pack v1.2: fastened the bug in Home windows 10