這個HTML5/CSS主題完美地適用於臺式機,也適用於移動版本,總是來自桌面瀏覽器,但在移動瀏覽器轉換過程中存在延遲(使用Chrome和Firefox進行測試)。CSS轉換滯後
有人可以幫助我改進CSS?我已經測試了許多解決方案,例如使用transform css propriety啓用硬件加速,但似乎沒有任何工作。
這是主題:https://html5up.net/uploads/demos/dimension/
這個HTML5/CSS主題完美地適用於臺式機,也適用於移動版本,總是來自桌面瀏覽器,但在移動瀏覽器轉換過程中存在延遲(使用Chrome和Firefox進行測試)。CSS轉換滯後
有人可以幫助我改進CSS?我已經測試了許多解決方案,例如使用transform css propriety啓用硬件加速,但似乎沒有任何工作。
這是主題:https://html5up.net/uploads/demos/dimension/
沒有挖得太深了進去,點擊菜單項時的滯後是由大的背景圖像上的轉變過濾blur
造成的。這只是一項固有的昂貴操作,並且與轉換scale
轉換相結合。
在這方面有一些技巧,例如爲模糊切換低分辨率,放大圖像,但它們確實是黑客 - 簡短的回答是,如果您需要平滑的過渡性能,請不要在複雜元素上設置動畫過濾器,並且絕對不會同時動畫組合過濾器和其他操作。
作爲快速修復,請在樣式表中找到body.is-article-visible #bg:after
部分,然後除去變換:scale();使背景只是模糊,不模糊和縮放:
body.is-article-visible #bg:after {
-moz-filter: blur(0.2rem);
-webkit-filter: blur(0.2rem);
-ms-filter: blur(0.2rem);
filter: blur(0.2rem);
}
這對我的機器性能有很大的影響。
感謝您的信息,無論如何,我已經刪除了所有的規模轉換,滯後減少,但不完全消失 – walter4991
您能否包含您的代碼? – Rubenxfd
只要看到來自源代碼的CSS:https://html5up.net/uploads/demos/dimension/assets/css/main.css – walter4991
@ walter4991,在你的問題中包含一些源代碼很重要,否則它對任何人都沒用將來搜索該鏈接是否停止工作。 – Beejamin