编写userscript替换背景图像(Writing a userscript that repla

这是代码

// ==UserScript==
// @name           Wood Background
// @namespace      http://www.nationstates.net/nation=ellorn
// @description    Changes background to wood finish
// @include       http:*//w11.zetaboards.com/Allied_Republics/*
// ==/UserScript==


function addCss(cssString) {
    var head = document.getElementsByTagName('head')[0];
    return unless head;
    var newCss = document.createElement('style');
    newCss.type = "text/css";
    newCss.innerHTML = cssString;
    head.appendChild(newCss);
}  
addCss (
    '* { background: #00ff00                          url('http://awesomewallpapers.files.wordpress.com/2010/01 /wooden_top.jpg') no-repeat 

fixed center;  }'
);

我想，以取代现场的背景： http://awesomewallpapers.files.wordpress.com/2010/01/wooden_top.jpg

Answer 1:

对于刚刚风格的变化，用时尚的附加 （此部分变种可以几乎每一个浏览器上）。

时尚比Greasemonkey的或userscripts更快，更轻，更容易。 有大量的预先制作的款式可在userstyles.org 。

除非是，使用内置的功能，如GM_addStyle()

下面的脚本在Firefox和Chrome，并可能其他一些浏览器。 （有一个在CSS串语法错误）：

// ==UserScript==
// @name        Wood Background
// @namespace   http://www.nationstates.net/nation=ellorn
// @description Changes background to wood finish
// @include     http:*//w11.zetaboards.com/Allied_Republics/*
// ==/UserScript==

GM_addStyle (
    "* { background: #00ff00 "
    + "url('http://awesomewallpapers.files.wordpress.com/2010/01/wooden_top.jpg')"
    + " no-repeat fixed center; }"
);

请注意，这将是最好更换*同body 。

Answer 2:

你可以定义你自己的用户样式表覆盖网站的作者样式表。 我认为这将是更适合于改变CSS比编写JavaScript。

这里是一个简短的介绍如何实现这一点。

除了从您的代码应该在一般的工作，如果你交出的CSS串正确（固定报价和换行符）：

var css = "* { background: #00ff00 url('http://awesomewallpapers.files.wordpress.com/2010/01/wooden_top.jpg') no-repeat fixed center;  }";

addCss ( css );

但是请注意， *将打破，因为你申请的木背景的每个元素，不仅是你的背景元素（HTML或身体或包装DIV）。

文章来源: Writing a userscript that replaces a background image