오늘 소개해드릴 플러그인은 jCrop이라는 이미지 크롭 플러그인입니다.
jCrop은 사용자가 올린 이미지 또는 기타 등등의 이유로 사용자 직접 크롭핑 할 부분을 선택하여 크롭핑을 할 수 있도록 도와주는 jQuery 플러그인입니다.
아래는 jCrop의 Live Demo입니다.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
<html>
<head>
<script src="js/jquery.Jcrop.js"></script>
<link rel="stylesheet" href="css/jquery.Jcrop.css" type="text/css" />
<script>
jQuery(document).ready(function(){
jQuery('#cropbox').Jcrop({
aspectRatio: 1,
onSelect: updateCoords,
setSelect: [ 100, 100, 200, 200 ]
});
});
</script>
</head>
<body>
<center><img src="/include/postExamples/jCrop/demos/demo_files/flowers.jpg" id="cropbox" /></center>
</body>
</html> |
