Div的高度得到擴展，但項目出現在div的工作區

Question

我想做這個簡單的任務。我有以下代碼div和ExtJS panel。 DEMO

#drawing 
{ 
    position: absolute; 
    border: solid 2px green; 
    width: 100%; 
    height: 300 
} 

和

var contentPanel = Ext.create('Ext.panel.Panel', 
{ 
    title: '', 
    region: 'center', 
    margins: '2 0 0 0', 
    border: false, 
    autoScroll: true, 
    contentEl: 'drawing', 
}); 

創建的意見後，一切都被渲染，我打電話是應該基於一些來調整DIV的身高有些JS功能條件。

我yCoord變量被計劃內遞增，一旦達到contentPanel的高度，我想的程度是div的用下面的代碼高度：

if (yCoord > contentPanel.getHeight() - 200) 
{ 
    document.getElementById('drawing').setAttribute("style", "height:"+ (2*yCoord) + "px"); 
} 

簡單，正確的？

，但是這是我有...
一旦高度設置，我可以看到垂直滾動條延伸面板上「意思是工作區已擴大」的問題。 但是，當你點擊第4次時，矩形會退出工作區。爲什麼？

Answer 1

你忘記調整你的拉斐爾的油畫：

p.setSize('100%', 2*yCoord+contentPanel.getHeight());