画像の切り抜きができるプラグイン「Jcrop」

動作には、Jcropのパックをダウンロードして、下記のようにして、HTMLのhead要素とCSSを用意する必要があります。

<script type="text/javascript" src="js/jquery.pack.js"><script>
<script type="text/javascript" src="js/jquery.Jcrop.pack.js"></script>
<script type="text/javascript" src="js/jquery.FieldsetToggle.js"></script>

CSS

.jcrop-vline, .jcrop-hline
{
	font-size: 0;
	position: absolute;
	background: white url('Jcrop.gif') top left repeat;
	/*
	opacity: .5;
	*filter:alpha(opacity=50);
	*/
}
.jcrop-vline { height: 100%; width: 1px !important; }
.jcrop-hline { width: 100%; height: 1px !important; }
.jcrop-handle {
	font-size: 1px;
	width: 7px !important;
	height: 7px !important;
	border: 1px #eee solid;
	background-color: #333;
	*width: 9px;
	*height: 9px;
}

.jcrop-tracker {
	*background-color: gray;
	width: 100%; height: 100%;
}

.custom .jcrop-vline,
.custom .jcrop-hline
{
	background: yellow;
}
.custom .jcrop-handle
{
	border-color: black;
	background-color: #C7BB00;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
}