如何创建可调整大小并一次调整大小？ （以编程方式开始调整大小）

Question

我想在鼠标位置创建一个可调整大小的div并将其立即调整为其所需的大小。 我失败的尝试至今：

http://jsfiddle.net/YKnfR/1/

就如何实现这一行为的任何想法？

Answer 1

这对你的CSS 添加上述您的＃块1选择：

#blocks > div 
{ 
    width: 200px; 
    height: 200px; 
} 

没有必要涉足，直到你希望用户调整其大小可调整大小的脚本。仅供参考，该CSS会更清晰与:not选择这样的：

#blocks > div:not(#block1) 
{ 
    width: 200px; 
    height: 200px; 
} 

但IE不支持:not，我不知道它如何妥善下降。这就是为什么你需要把第一个例子放在＃block1选择器上面。

Answer 2

你只需要添加所需的大小和使用heigth（）和宽度（宽度）：

$(document).mousedown(function(e){ 
    var block = $('<div id="new">New</div>') 

    $('#blocks').append(block) 
    block.css('left', e.pageX).css('top', e.pageY).resizable() 

    block.height('40'); 
    block.width('40'); 
}) 

或者，你可以把这些设置右进CSS。