GrassHopperPebbles.com Demos

JQuery Plugins

gpImageRotate 0.5 - Blinds inOut x-Axis

The following example displays the gpImageRotate plugin in blinds mode with the transition_direction set to inOut.

I also set the segments option to 8 (the default is 4).

$(document).ready(function(){
	$("#cast").gpImageRotate({
	    mode: 'blinds',
	    segments: 8,
	    transition_direction: 'inOut',
	    interval: 5000,
		data_map: {
			image_name: 'name',
			url_name: 'url'
		},
		image_url: "random.php",
		base_path: "imagerotate/"
	});
});		
#cast {
	float:left;
	margin-left:40px;
	margin-top:20px;
	height:100px;
	width:150px;
}

.gpImageRotate-DisplayCntnr {
	position:relative;
	top:0;
	left:0;
}

IMG {
	border:none;
}	

For documentation about the gpImageRotate plugin, view the blog post.

Tags

, , , , , , , , , ,