#gridacord a jquery accordion for image grids

contents
What is
Example
Requirements
How to use
Parameters
Frame center
Contribute
Limitations

###What is Gridacord is a jquery plugin that creates an accordion-style image gallery grid with minimum necessary setup yet customizable.

###Requirements

• jQuery UI

• jQuery imagesLoaded (provided)

###How to use

$("#mygrid").gridacord(); 

or

$("#mygrid").gridacord({item_margin : 2, transition_time: 1000}); 

###Parameters

• item_margin - Margin of each picture frame in pixels
• width - Width of each picture frame in pixels
• height - Height of each picture frame in pixels
• transition_time - Frame expansion animation transition time

###Frame center To define which spot of the picture will be on the center of frame it's possible to define two extra parameters on <div class="item"> like in the example below:

<div class="item" data-spot-x="40" data-spot-y="20">
  <img src="5.jpg"/>
</div>

• data-spot-x - the x axis distance in % of the left top corner to the right top corner
• data-spot-y - the y axis distance in % of the left top corner to the left bottom corner

-------- x axis ------>100
|0
|
|       
y
axis   IMAGE
|
|
V
100

###Limitations

• Only 2x2, 3x3, 4x4 ... grids can be used

###Contribute Plz.