2011-05-10 140 views
1

我有一個我在CSS中創建的設計,它已經開始排序,呃懶惰的滾動。我的意思是滾動條在你滾動的時候會滯後一點。這是什麼原因導致我可以從我的網站進行調試?什麼導致CSS中的延遲/滯後滾動?

編輯:

該文件有含量很少(甚至不是一個段落),所以沒有太多的。沒有閃光燈,兩個圖像。

編輯:

我覺得這麼愚蠢。格式不正確的背景:屬性導致了問題。不過謝謝大家。

+1

可能大量的CPU密集型內容滯後一個站點一個可怕的經歷?很多視頻,JavaScript ..?你能鏈接到問題頁面嗎?哪些瀏覽器/平臺? – 2011-05-10 16:05:22

+0

聽起來像一個大的DOM也許。 HTML文件有多大(以kb爲單位)? – 2011-05-10 16:11:38

+0

嘗試重新啓動您的瀏覽器 – 2011-05-10 16:35:03

回答

1

這可能是由於通過CSS的重處理要求。

(CSS會影響每個瀏覽器的滾動)我已經多次看到這種情況(最糟糕的情況是SVG)。由於它是AA,所以它通常會像Chrome一樣很難瀏覽瀏覽器。

有一個很棒的網站,詳細介紹了最重要的最安全的屬性用於CSS效果,對不起,我沒有鏈接。儘管根據我的經驗,我會考慮:

漸變:您的特徵越多或覆蓋面積越大,渲染計算的指數越大。濫用停止和額外的顏色也增加了混亂。

Border-Radius:通常會剪掉它的內部內容,不管它是什麼。排除時我注意到了差異。

如果再加上其他CSS效果,不透明度可能是主要問題。在某些情況下,我發現在消除不透明度或減少使用率方面有了很大的改進。因爲它不僅僅是透明度,而且也是一些瀏覽器反鋸齒文本的驅動。

圖片:圖片可能會影響滾動的方式應該是顯而易見的,儘管我發現通過原始分辨率對圖片進行重新調整大小可能會變得更加明顯。

使用諸如background-size之類的屬性:;在某些情況下會產生巨大的影響力,解決方法可能是刪除div,替換爲< img>,並用包含文本/內容的空白格 覆蓋。

動畫轉換&如果濫用,翻譯顯然會影響功耗,特別是動畫不斷循環或通過百分比重新調整瀏覽器的大小。

裸在低規格的賽揚PC上的頭腦會有人有對你的合理/高功率的PC/MAC