语境
我有一个 <table> 列标题，它可能代表对象的不同种类或状态（例如，假设它可能是动物或人）。行标题代表对象的一些特征。
在页面的另一个 div 中，我有一个实例列表（一些代表动物或人）。我使用拖放（使用 JQuery）将它们放入表格的单元格中。在 <td> 中放置了一个 <div> 之后，直到我离开页面（提交表单），我仍然可以将它拖到另一个 <td> 中（以防我出错并将其放置到错误的单元格）。
问题
现在，我想让我放置的对象可调整大小以填充与其相邻的行（例如，为他提供多个特征）。此外，在调整大小操作之后，对象必须在另一个单元格中保持可拖动，保持它的新大小（代表特征）。
我找不到一种方法来处理调整大小的操作来做我想做的事情。
我如何使用 html、javascript 和/或 Jquery 来做到这一点？
编辑：我当前代码的一个示例：http: //jsfiddle.net/B99KY/13/（对不起，如果 js 不是很干净）。我可以拖动元素，但我不知道如何处理调整大小操作来完成我想要实现的目标。
var resizableHandler = {
handles: "s",
start: function(e, ui) {
console.log('resizing started');
},
resize: function(e, ui) {
},
stop: function(e, ui) {
console.log('resizing stopped');
}
}
例如，如果我将“实例 1”放在单元格 [charecteristic1，state1] 中，然后调整“实例 1”的大小以填充 charecteristic2 和 charecteristic3，我希望“实例 1”完全填满新闻单元格（到在提交此选项卡后使用它们）。