Jquery UIのドラッグ可能なヘルパーの幅を動的に変更し、ドロップ可能なものの許容範囲の効果を変更するにはどうすればよいですか?
ケース:jqueryuiで1つのヘルパーをドラッグ可能にした場合。次に、このドラッグ可能なオブジェクトをドロップ可能な領域に配置します。ドロップ可能では、over関数はこのヘルパー幅を変更する必要があります。そのため、この関数ではヘルパーオブジェクトの幅を変更しましたが 、ドロップ可能では許容値効果は機能 しません。コードを参照してください:
// let the gallery items be draggable
$( ".elementDrag", elementContainer ).draggable({
revert: "invalid",
//helper: "clone",
helper: function(event) {
DOM2 = $('<div style="border: 1px solid;"></div>');
DOM2.outerWidth(passObj.width + 20);
DOM2.outerHeight(passObj.height);
return DOM2;
},
cursor: "move",
start: function(event, ui)
{
},
stop: function(event, ui)
{
}
});
pageContainer.droppable({
accept: ".elementDrag",
tolerance: "fit",
greedy: true,
drop: function( event, ui )
{
outerContainer.removeClass('over');
},
over: function(event, ui) {
console.log(ui);
console.log(ui.helper);
console.log($(ui.helper).outerWidth());
// new width set but tolerance effect is not work ....
$(ui.helper).outerWidth($(ui.helper).outerWidth() - 20);
console.log($(ui.helper).outerWidth());
outerContainer.addClass('over');
},
out: function() {
outerContainer.removeClass('over');
}
})