Chrome擴展太慢

Question

我得到一個小的script即時通訊使用Firefox和Chrome， 它只是改變了這個頁面的顏色。 在Firefox中它工作正常， 但在Chrome中，我可以看到頁面的原始顏色，它在更改後的第一個和第二個秒鐘。

這是正常的嗎？ （How）我可以改變它嗎？

Answer 1

Ive得到了不知道如何與通用腳本來做到這一點，但這裏是如何做到這一點作爲一個Chrome擴展....

manifest.json的

{ 
    "name": "SO css", 
    "content_scripts": [ 
     { 
     "matches": [ 
      "http://*.stackoverflow.com/*" 
     ], 
     "css": ["new.css"], 
     "run_at" : "document_start" 
     } 
    ], 
    "version":"1.0", 
    "manifest_version" : 2 
} 

新。 CSS

#custom-header  {background-color: rgb(251,122,35) !important} 

#nav-questions  {background-color: rgb(251,122,35) !important} 
#nav-tags   {background-color: rgb(251,122,35) !important} 
#nav-users   {background-color: rgb(251,122,35) !important} 
#nav-badges   {background-color: rgb(251,122,35) !important} 
#nav-unanswered  {background-color: rgb(251,122,35) !important} 
#nav-askquestion  {background-color: rgb(251,122,35) !important} 

信息內容腳本....
http://developer.chrome.com/extensions/content_scripts.html
信息上的Chrome擴展程序....
http://developer.chrome.com/extensions/getstarted.html

如果通用腳本有run_at等同那麼它需要document_start其聲音如CSS是在document_idle得到注入，這將是DOM /頁之後被加載。你之前想要它，所以你沒有看到它的變化。這就是爲什麼我在我的答案中添加!important到每一個CSS規則，以確保他們沒有改變任何可能會出現在你的CSS後。

編輯
看着它，有一個run_at變量，這裏是與上面相同，但作爲一個通用腳本....

// ==UserScript== 
// @name  SO 
// @namespace stackoverflow.com 
// @include  *stackoverflow.com/* 
// @version  1 
// @grant  GM_addStyle 
// @run-at  document-start 
// ==/UserScript== 

changeHeaderColor(); 

function changeHeaderColor() { 
    GM_addStyle ("             \ 
     /*body { color: white; background-color: black !important}   \ 
     */               \ 
     #custom-header  {background-color: rgb(251,122,35) !important} \ 
                    \ 
     #nav-questions  {background-color: rgb(251,122,35) !important} \ 
     #nav-tags   {background-color: rgb(251,122,35) !important} \ 
     #nav-users   {background-color: rgb(251,122,35) !important} \ 
     #nav-badges   {background-color: rgb(251,122,35) !important} \ 
     #nav-unanswered  {background-color: rgb(251,122,35) !important} \ 
     #nav-askquestion  {background-color: rgb(251,122,35) !important} \ 
     /*Blau: rgb(0,160,160) rgb(0,200,200)      \ 
     */               \ 
    "); 
}