jQuery的CSS渲染 - 在Firefox中，而不是在Chrome中運行

我正在使用jQuery滑塊來調整包含段落文本的DIV的填充。隨着我在所有方面均勻地增加填充，它應該強制將封閉的段落放在頁面中間的更窄的列中。jQuery的CSS渲染 - 在Firefox中，而不是在Chrome中運行

這可以在Firefox中使用，但在Chrome中，段落寬度保持不變（即DIV的填充不會變窄），因此將佈局推向右側。

我在這裏重新創建了這個問題：jsfiddle.net/ms3Jd。您可以在Chrome和Firefox中嘗試使用它來查看區別。

關於如何強制Chrome刷新封閉段落的任何想法？

2012-01-19 Mateo

看起來像WebKit的bug對我來說。 – thirtydot

可能 - 但我知道有些方法可以強制（或欺騙）Chrome來刷新/重繪/重新計算頁面元素，但不知道如何去做。有任何想法嗎？ – Mateo

我知道有方法可以強制（或特技）Chrome瀏覽器刷新/重繪/ recalcuate頁面元素，但不知道如何做呢。有任何想法嗎？

sel.style.display='none'; 
sel.offsetHeight; // no need to store this anywhere, the reference is enough 
sel.style.display='block';

我迅速應用在這裏，但你應該把它做成功能：http://jsfiddle.net/thirtydot/ms3Jd/5/

2012-01-19 15:10:09 thirtydot

jQuery插件版本：http://jsfiddle.net/thirtydot/ms3Jd/7/。可能會過度。 – thirtydot

它的工作原理 - 謝謝（和其他答覆者） - 你是一個天才！ – Mateo

您可以添加溢出和float屬性：

#preview > div { 
    padding: 5%; 
    overflow: auto; 
    float: left; 
}

2012-01-19 14:38:41 Ninja

嗯......這是進步，並讓我們在那裏一半。謝謝。我在jsfiddle中嘗試過 - 當我們增加填充時，段落會重新計算。但是如果我們再次減少填充量，它們不會再擴大。你可以提供什麼進一步的改進？ – Mateo

我使用fadeTo迫使鉻刷新。
不知道，但我想這是fadeTo上的動畫
嘗試該線jsfiddle。

$('#preview > div').css('padding', ui.value + '%').children('p').fadeTo(1, .99).fadeTo(1, 1);

2012-05-11 19:16:15

回答