需要做出IMG拖動和可調整大小

這裏是我的代碼：需要做出IMG拖動和可調整大小

{//Add Image 
    $('#add_btn').click(function() {  
     var src$ = $('#img_loc').val(); 
     $('<img>').attr({ 
      src: src$, 
      class: 'item'}) 
     .addClass('canDrag') 
     .appendTo($('#work_area')); 

     $('.canDrag').draggable({ 
      snap:'.dropSpace' 
     }); 
     $('.dropSpace').droppable({ 
      accept:'.canDrag' 
     }); 

    }); 
} 

{//Move 
    $('#move').click(function() { 
     $('#work_area .item').removeClass('resizeMe');   
     $('#work_area .item').addClass('canDrag'); 

     $('.canDrag').draggable({ 
      snap:'.dropSpace' 
     }); 
     $('.dropSpace').droppable({ 
      accept:'.canDrag' 
     }); 
    }); 
} 

{//Resize 
    $('#resize').click(function() { 
     $('#work_area .item').removeClass('canDrag'); 
     $('#work_area .item').addClass('resizeMe'); 

     $('.resizeMe').resizable(); 
    }); 
}

我正在做一個畫布（不是HTML 5 canvas元素），用戶可以在其中添加圖片，拖動，並調整它們的大小。用戶使用各自的ids按鈕激活「移動」和「調整大小」工具。我需要點擊一個按鈕來禁用其他效果（即，當點擊「移動」時，圖像不可調整大小，並且當點擊「調整大小」時，圖像不可移動）

以下代碼使得圖像可拖動，但我無法使其可調整大小。任何人都可以解釋什麼是做錯了嗎？（請投票，如果你不知道答案）

來源

2011-12-12 dopatraman

在Firebug（或其他DOM瀏覽器）你能看到可調整大小的元素上的jQuery可調整大小類嗎？ I.E.是由jQuery UI更新的元素，但不能正常工作，或者它甚至沒有被更新？在控制檯中出現錯誤？ – danwellman

一切都與你的代碼是正確的，你只是缺少（）需要可調整大小的Jquery.UI CSS文件操作：

<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/themes/base/jquery-ui.css"/>

這裏看看吧你自己：http://jsfiddle.net/gcQmM/2/

來源

2011-12-14 00:16:01 kidwon

需要做出IMG拖動和可調整大小

回答

相關問題