jShutterBox is a jQuery plugin I have developed two or three months ago. But I didnt release it because It was complex and users had to supply content for every animated images. Though it was ok with me that time, but last week I thought that I could make it even simpler to use. For example, just a &ltdiv> containing an image and an anchor can be converted into an animated content box 🙂

to use jShutterBox is simple. Just download the package from Box.net, include jshutterbox.js in your page, and run the following code 🙂

[sourcecode lang=”html”]
<div class="animated">
<img src="http://scripts.ofhas.in/jshutterbox/images/image2.jpg"/>
<a href="http://leevio.com" title="Leevio">Welcome to Leevio</a>
</div>
<script type="text/javascript">
$(document).ready(function(){
$(".animated").jShutterBox({slide:"random"});
});
</script>
[/sourcecode]

You can configure other options, like “height”, “width”, “duration”, “borderWidth”, “borderColor”, “slide”. You can pass “random” as a value of “slide” to see the random animation. You can also specify any value of the “up,”down”,”left”,”right”,”up-left”,”up-right”,”down-left”,”down-right”for “slide” to see any specific animation too 🙂

You can view the demo at http://scripts.ofhas.in/jshutterbox/demo.html

I hope you will like it 🙂 – by the way, this plugin depends on jQuery Easing plugin.

Download jShutterBox from DropBox

Shameless Note 🙂 : By the way, if you are looking for a beautiful Admin Panel Theme for your PHP based projects/web-applications, you may want to check out Chameleon Circuit, which is developed by our Themio Team 🙂