c# - Crop and save images as circle JCrop -


i have page let users upload picture , picture have make selection work with. selection has circle specific dimensions. acheiving used below --

 .jcrop-holder div         {             -webkit-border-radius: 50% !important;             -moz-border-radius: 50% !important;             border-radius: 50% !important;             margin: -1px;         } 

now want save circle of image..currently saves square.how 1 create round image circle selection? appreciated..

the work around have done following:

$('#<%=imgupload.clientid%>').jcrop({             onselect: selectcroparea,             boxwidth: 600,             boxheight: 600,             maxsize: [500, 500],             minsize: [100, 100],             aspectratio: 2/2         }); 

so can see, have done is: doesnt matter size image is; viewed 600x600 , limited crop size such min , max 100 , 500.

further more after user have cropped it, image still square on lay radius such:

<div style="height: 94px; width: 94px; border-radius: 100px; -webkit-border-radius: 100px;overflow: hidden; position: relative; top: 30px; left: 50px; display:table-cell; vertical-align:middle;">   <img src="../images/user.png" runat="server" id="imgprofile" alt="profile picture" style="width:100px;"/> 

this should work around.

hope helps.

regards


Comments

Popular posts from this blog

Magento/PHP - Get phones on all members in a customer group -

php - .htaccess mod_rewrite for dynamic url which has domain names -

Website Login Issue developed in magento -