11.18.2010

jQuery PhotoShoot Plugin 1.0

Description:   The jQuery PhotoShoot plugin gives you the ability to convert any div on your web page into a complete photo shooting effect.
   

Features:  
Author: Freebies
   
下載:  Download  (密碼:  見壓縮檔註解)

By dowloading you accept our Terms & Disclaimer.


Instructions:
Usage

First, you need to upload the plug-in to your server (it would be best to keep the folder structure intact), and include the stylesheet and js file to the page where you want it to show.

<link rel="stylesheet" type="text/css" href="photoShoot/jquery.photoShoot-1.0.css" />

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="photoShoot/jquery.photoShoot-1.0.js"></script>

The plug-in depends on version 1.3.2 of jQuery, but will work fine with newer versions as well.

After this you can convert any div on your page by calling the .photoShoot() method and passing a configuration object.

document.ready(function(){

	var config = {
		image : 'picture.jpg',
	}

	$('#selector').photoShoot(config)
});

The onClick function

You can provide your function to be executed when a click occurs. An object containing the location (left and top) of the viewfinder, relative to the background, is passed as the only parameter. Here is how it works:

document.ready(function(){

	var config = {
		image	: 'picture.jpg',
		blurLevel	: 6,
		opacity	: 0.8,
		onClick	: alertPosition
	}

	function alertPosition(param){
		alert("The viewfinder is located at: "+param.left+"x"+param.top);
	}

	$('#selector').photoShoot(config)
});

License
The plugin is distributed under an MIT license.
    If you believe that your work has been copied in a way that constitutes copyright infringement, or that your intellectual property rights have been otherwise violated, please e-mail us

0 留言:

發佈留言

您使用留言則表示同意及遵守使用條款及守則

建議: 為方便留言回覆,請不要用匿名方式 留言。