2011-02-02 82 views
2

注:我知道offsetWidth只我可以輕鬆地「設置」元素的offsetWidth嗎?

我試圖做一個彈出「格」覆蓋一個tr完全相同的寬度元素被讀取。

不過,我難倒如何設置我的divwidth使其offsetWidth是完全相同的tr

計算看起來是這樣的:

div.width = tr.offsetWidth - div.paddingWidth - div.marginWidth 

但肯定有一個更好的辦法(因爲我只能想到得到的填充和保證金偏移量的兩組...)

具體如果可能的話,我想要YUI 2的答案。

+0

它在我看來像你已經回答了你自己的問題。我唯一的建議是分別獲得div的計算左右邊距和填充值,因爲它們可能都不相同。 – 2011-02-02 03:23:50

+0

@Matt Ball:好的,所以我將標題改爲_easily_設置寬度。我只是很難相信它沒有內置到某個庫(即使它不是YUI) – Stephen 2011-02-02 03:31:46

回答

2

如果零出你的div的保證金和墊襯,然後像下面應該工作:

YAHOO.util.Dom.setStyle(div, 'width', tr.offsetWidth + 'px'); 

取決於你是如何處理的邊框在您divtr你可能要分配tr.clientWidth代替。

然後,您可以根據需要在div的父/子元素上設置任何邊距/填充以達到所需的外觀。

的關鍵在於制定出你想要做的是瞭解什麼clientWidth and offsetWidth measure什麼,一個元素的CSS width是它的內容區域,不包括任何空白,邊框,並在其上(see the W3C box model here)定義的填充。

你可以從

0

查詢它包括在計算中的填充等,這是一個有點亂,我可能會downvoted的建議,但你可以做到這一點的一種方式,而不使用您的保證金或填充搞亂是將div的寬度設置爲已知值,然後找到該div與div的offsetWidth之間的差異。這應該告訴你如何設置寬度以使其適合。

div.style.width = '20px' 
diff = div.offsetWidth - 20; 
div.style.width = tr.offsetWidth - diff; 

這實在是混亂,但你不必在意填充,保證金或邊框這樣。

相關問題