jQuery UI Resizable
次のようにdomに追加されたら、要素を動的に与えようとしています:
insert.click(function(e) {
var selectedImage = $(this).parent().find('.gallery-item.active');
var htmlImage = selectedImage.find('img');
var selectedDiv = $('.zone.selected .drag-image');
//selectedDiv.clone().append(htmlImage);
var insertedImage = htmlImage.clone();
var resized = insertedImage.resizable();
console.log(selectedDiv);
console.log(resized);
resized.appendTo(selectedDiv);
});
});
active
これが何をするかというと、クリックされてクラスが与えられた画像を見つけます。insert-image
(href ボタン) がクリックされると、画像をコピーして DOM に追加します。
これはうまくいきます。問題は、画像にresizeable
.
上記のコードを実行するimg
と、DOM に次の HTML が挿入されます。
サイズ変更可能な矢印の画像を表示する UI コードが含まれていないようです。
<div class="ui-resizable-handle ui-resizable-e" style=""></div>
<div class="ui-resizable-handle ui-resizable-s" style=""></div>
<div class="ui-resizable-handle ui-resizable-se ui-icon ui-icon-gripsmall-diagonal-se ui-icon-grip-diagonal-se" style="z-index: 1001;"></div>
要素のサイズを変更できるようにするすべてのコードを追加する方法はありますか?