Изображение можно перетаскивать, но не изменять размер

Я добавляю динамический ярлык img в контейнер div. При создании 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);

Это измененный код, как предложил Whitaker, но @ Андрей еще не работает, пожалуйста, помогите мне с этим ..

  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" 

                    });

источник

2011-12-22 Manoj G

Я бы попробовал обернуть 'img' в' div' и применить к нему изменение. Смена размера не слишком хорошо воспроизводится с изображениями. –

Я тоже пытался обернуть, но доцент для меня. Можете ли вы привести мне пример, как это сделать, возможно, я ошибался. –

Что такое переменная count для ..? –

Наконец я нашел метод. Для расширения и перетаскивания функциональности для тега img не требуется оболочка div.

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

Это работает для меня.

источник

2011-12-26 14:01:05

Изображение можно перетаскивать, но не изменять размер

ответ

Смежные вопросы