Jcrop » Styling Demo

So maybe you like the color yellow.

This demo shows the use of some styling techniques as well as other parameters to control the presentation. It also starts with an initial selection to immediately display the new style.

Invocation Code:
<script language="Javascript">
$(function() {
	$('#jcrop_target').Jcrop({
		setSelect: [ 20, 130, 480, 230 ],
		addClass: 'custom',
		bgColor: 'yellow',
		bgOpacity: .8,
		sideHandles: false
	});
});
</script>
Custom CSS:
.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;
}

These demos have been adapted for this website. Simplified versions of the same demos (with simplified source code) are included in the archive download.

©2008-2010 Deep Liquid Group | Contact