如何創建可調整大小並一次調整大小？ （以編程方式開始調整大小）

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。