Download
spacegallery.zip (205 kb): jQuery, Javscript files, CSS files, images, examples and instructions.
Changelog
- 09.01.2008
- The first release release.
Whilst some companies have in-house product design facilities, many prefer to out-source the expertise, allowing them to concentrate on core disciplines such as sales.
Managing this process can take a great deal of time, experience and coordination. The same problems can run through to marketing your end product too.
Smashing Publicity and sister company Asia Product Solutions can take an initial product design brief and follow it through to prototype, finished product and beyond to branding, PR and advertising; all under a single assured management team with a combined 25 years of successful, and global, manufacturing and marketing experience.
Implement
Attach the Javascript and CSS files to your document. Edit CSS file and fix the paths to images and change colors to fit your site theme. Important: be sure to include Javascript files in the specific order as in the example below.
<link rel="stylesheet" media="screen" type="text/css" href="css/spacegallery.css" />
<script type="text/javascript" src="js/eye.js"></script>
<script type="text/javascript" src="js/utils.js"></script>
<script type="text/javascript" src="js/spacegallery.js"></script>
Invocation code
Prepare a block level element with some images inside. All you have to do is to select the elements in a jQuery way and call the plugin.
$('#myGallery').spacegallery({loadingClass: 'loading'});
Options
A hash of parameters. All parameters are optional.
| border |
integer |
Images' border. Default: 0 |
| duration |
integer |
Animation duration. Default 800 |
| perspective |
integer |
Perpective height. Default: 140 |
| minScale |
float |
Minimum scale for the image in the back. Default: 0.2 |
| loadingClass |
string |
CSS class applied to the element while looading images. Default: null |
| before |
function |
Callback function triggered before going to the next image |
| after |
function |
Callback function triggered after going to the next image |
