爲什麼jQuery的position（）和offset（）方法在Chrome中返回小數？

我有一個簡單的div標籤，絕對位於HTML文檔中。在Chrome中，我將其「右」CSS規則設置爲固定值（像素），將其「左」規則設置爲「自動」，然後立即使用jquery的position（）方法確定其左側位置，是這樣的：122.6363525390625。同樣的方法爲offset（）方法。爲什麼jQuery的position（）和offset（）方法在Chrome中返回小數？

另一方面，Firefox沒有這個問題。

你能告訴我爲什麼會發生這種情況，如果有辦法阻止它？在此先感謝！

來源

2012-06-22 Andrei Oniga

你可以設置一個小例子來演示這種行爲嗎？我無法在這裏重現它：http://jsfiddle.net/Wjvak/ – Simon

嘗試本地方法：getComputedStyle（yourElem）.getPropertyValue（'left'）'。如果它返回一個浮點數，那麼這就是Chrome爲您提供的內容，您必須手動將該數字轉換爲整數。 –

因爲當你使用百分比的寬度，這是數學的成果。試想一下，你有這樣的佈局：

<div style="width: 111px"> 
    <div style="width: 50%"></div> 
</div>

內部元素的寬度計算到55.5像素，不是自然數。根據確切的CSS屬性，這可以很容易地解決到更多的小數位。

Chrome uses subpixel rendering，所以這就是爲什麼你看到這種行爲。

最後：我不確定爲什麼這會導致你的問題，但當然，如果你想輪到一個自然數，你可以使用Math.round(x)。

來源

2012-06-23 11:58:37 Jon

-2

在Chrome中，值被截斷，所以120,120.5和120.6都顯示相同的寬度，所以您不必擔心使用十進制值。沒有什麼像.5像素。像素是整個單位。如果你確實有函數返回十進制值的問題，那麼爲什麼不使用parseInt？你不應該把這件事留給瀏覽器來照顧，否則你的頁面可能會崩潰。

來源

2012-06-23 10:50:10

爲什麼jQuery的position（）和offset（）方法在Chrome中返回小數？

回答

相關問題