What is it?

jPolaroid is a jQuery plugin, which turns your boring images into fun, customizable Polaroid style images! It is simple to use and very clean. Download the tarball, or zip, view the examples, then start adding some retro style to your webpages.

Download

Requires jQuery 1.3.x.

Download jPolaroid 1.1

The development code is kept at GitHub at http://github.com/steveram/jpolaroid

Support

Tested in FF3, Chrome, IE7, Safari

Join our Google Groups mailing list.

Installation

Include the css and js file, along with the jQuery library. Don't forget to change the paths to your image directory in the css file.

<script type="text/javascript" src="path_to_js/jquery.js"></script>
<script type="text/javaScript" src="path_to_js/jquery.jpolaroid.js"></script>
<link rel="stylesheet" href="path_to_css/jpolaroid.css" type="text/css"/>

Usage

1. The simplest way to use jPolaroid is to call polaroid() on any image element:

<img id = "jquery" src = "_images/jquery-logo.gif"></img>
		

$(document).ready(function(){
	$('#jquery').polaroid();
});
		

Result:

2. You can also pass in options into the polaroid function:

<img id = "sanfran" src = "_images/san-francisco.jpg"></img>

$(document).ready(function(){
	$('#sanfran').polaroid({
		tape:true,
		shadowPos: "top-left",
		bottom: "50px",
		top: "22px",
		left: "24px",
		right: "24px",
		shadowColor: "#CCCCCC",
		backgroundColor: "#FDFDFD"
	});
});

Result:

3. Here is a list of all possible options you can pass: