2011-12-22 90 views
1

我在容器div中動態添加img標籤。創建IMG時,我添加了2類可拖動和可調整大小,然後附加到容器。所以我能夠拖動但無法調整大小。什麼可能是這個問題?圖像可拖動但不能調整大小

下面是創建img標籤

var img = document.createElement('img'); 
$(img).attr("id", "dyndiv" + count); 
$(img).attr("width", 40); 
$(img).attr("height", 100); 
$(img).attr("src", 'Uploads/' + window.frames['ifrm'].document.getElementById('dvFileName').innerHTML); 

var $ctrl = $(img).addClass("draggable resizable ui-widget-content") 
    .draggable({ 
     containment: '#containment-wrapper', 
     cursor: 'move', 
     snap: '#containment-wrapper' 
    }) 
    .resizable({ 
     aspectRatio:true, 
     containment: '#containment-wrapper' 
    }); 

objid = "dyndiv" + count; 
count++; 

$(img).css("margin-top", Math.ceil(140/2) + 'px'); 
$(img).css("margin-left", Math.ceil(60/2) + 'px'); 
$(img).css({ 
    'top':20, 
    'left':30, 
    'zindex':400 + count 
});         
$("#containment-wrapper").append($ctrl); 

這是改變的代碼由@Andrew惠特克建議,但它仍然是行不通的好心幫助我的代碼..

  var $wrap_div = $("<div></div>", { 'id' : "dyndiv_img" + count }) ; 
      $wrap_div.addClass("wrapper"); 
      $wrap_div.resizable({ containment: '#containment-wrapper'}); 

     var img_clip = document.createElement('img'); 

                    $(img_clip).attr("id", "dyndiv" + count); 
                    $(img_clip).attr("src", current_clip) ;                   
                    var $ctrl = $(img_clip).addClass("draggable ui-resizable ui-widget-content").draggable({ containment: '#containment-wrapper', cursor: 'move',delay: 200,distance: 30, opacity: 0.35}).wrap($wrap_div); 
                    objid = "dyndiv" + count ; 
                    count++; 

                    $(img_clip).css({'top':20,'left':30}); 
                     //($ctrl).resizable({ containment: '#containment-wrapper'}) ;                 
                    $("#containment-wrapper").append($ctrl); 
                    $('#' + objid).position({ 
                    of: $("#containment-wrapper"), 
                    my: "center" + " " + "center", 
                    at: "center" + " " + "center" 

                    }); 
+0

我會嘗試包裹'img'在'div'和應用可調整大小了這一點。有時候可調整大小的圖像播放效果不佳。 – 2011-12-22 15:31:34

+0

我試圖包裝,但dosent工作對我來說。你能給我一個例子嗎?如何做到這一點可能是我做錯了。 – 2011-12-22 16:15:23

+0

什麼是..的計數變量? – 2011-12-25 11:36:05

回答

1

最後我找到了這個方法。 img標籤的大小調整和拖拽功能不需要包裝div。

   $(img_tag).resizable().parent().draggable(); 

這適用於我。

:)

相關問題