jQuery-头像上传裁剪旋转放大代码

代码片段：

$(function(){
var html = '<div class="boxCen">';
html += '<div id="clipArea" class="file-clip"></div>';
html += '<div class="file">';
        html += '<div class="file-btn">点击上传图片</div>';
        html += '<input type="file" class="service-file" id="file">';
        html += '</div>';
html += '<div class="file-btn" id="clipBtn">裁剪图片</div>';
html += '<div class="file-btn" id="rotaBtn">选转</div>';
html += '<div class="file-btn" id="bigImg" >放大</div>';
html += '<div class="file-btn" id="smallImg">缩小</div>';
html += '<div class="red">（鼠标滚轮为缩放，每次双击则顺时针旋转90度）</div>';
html += '</div>';
html += '<div id="imgHtml" class="clipEnd"></div>';
$('#tt').html(html);
clip();