动态改变掉落元素的高度和宽度

我创建了一个拖放n拖放文件，其中用户在点击放置元素时将输入像3 * 4这样的坐标，使用标量因子得到元素的高度和宽度。我想要改变被丢弃元素的高度和宽度。谁能帮忙？动态改变掉落元素的高度和宽度

$(document).ready(function() { 

    var x = null; 

    // Make element draggable 
    $(".drag").draggable({ 
    helper: 'clone', 
    cursor: 'move', 
    tolerance: 'fit' 
    }); 

    var i = 1, j = 0; 
    var x1, x2, y1, y2, tmp, tmp2; 
    var sf = pf; 

    $("#droppable").droppable({ 

    drop: function(e, ui) { 

     var attr = ui.helper.attr('id'); 
     if (typeof attr == typeof undefined || attr == false) { 
     ui.helper.attr('id',"id"+i); 
     } 
     tmp = ui.helper.attr('id'); 
     x = ui.helper.clone().bind("click",'img',function(){ 

     alert("clicked"+ ui.helper.attr('id') + tmp); 
     leftpos = ui.offset.left-210; 
     toppos = ui.offset.top; 
     var cor = window.prompt("Enter coordinates x1,y1"); 
     var c = cor.split(','); 
     var w = c[0]*sf; 
     var h = c[1]*sf; 
     w = w/2; 
     h = h/2; 
     ui.helper.width(leftpos-w); 
     ui.helper.height(toppos-h); 
     }); 

     x.draggable({ 
     helper: 'original', 
     containment: '#droppable', 
     tolerance: 'fit', 
     }); 

     x.appendTo('#droppable'); 
     ui.helper.remove(); 
     i++; 
    } 
    }); 
});

来源

2016-04-04 Vinita Vaswani

掉落的jsfiddle – madalinivascu

因为整个代码混淆了，我不能创建它。 –

@VinitaVaswani：真的很难理解你的说法，所以你可以在最小代码内创建一个jsfiddle。 – dreamweiver

在你的代码中缺少一些东西。

的click事件处理程序是一个closure，这意味着即使该事件处理函数其定义的范围之外执行那就要ui.helper访问。但要更改宽度和高度，则需要通过this关键字引用当前事件绑定对象。
变量pf是未定义的，所以我定义了一个具有相同名称的局部变量。
用你目前的逻辑，目标丢弃的项目看起来很奇怪，所以我在下面的jsfiddle中为宽度和高度设置了300的静态值。

JS代码：

x= ui.helper.clone().bind("click", 'img', function() { 
    //leftpos = ui.helper.offset.left - 210; 
    //toppos = ui.helper.offset.top; 
    leftpos = ($(this).offset().left) - 210; 
    toppos = ($(this).offset().top); 
    ... 

    //ui.helper.width(leftpos-w); 
    //ui.helper.height(toppos-h); 
    $(this).width(300); 
    $(this).height(300);

Live Demo @ JSFiddle

来源

2016-04-05 07:45:31 dreamweiver

动态改变掉落元素的高度和宽度

回答

相关问题