Question

我正在为firefox开发一个插件。我需要添加一些背景图片。还有一个自定义css文件。但由于相对路径，无法从那里添加图像。我用谷歌搜索并发现解决方案可能是通过contentStyle添加图像。但它没有用。

这是我的代码

var pageMod = require("sdk/page-mod");
var self = require("sdk/self");

pageMod.PageMod({
    include: "*",
    contentScriptFile: [
        self.data.url("chrome/js/jquery.js"),
        self.data.url("chrome/js/generic.js")
    ],
    contentScriptOptions: {
        imgeFolder: self.data.url("chrome/images/"),
        fontFolder: self.data.url("chrome/font")
    },
    contentStyleFile: [self.data.url("chrome/css/style.css")],
    contentStyle: [
        "@font-face{font-family: roboto;src: url(" + self.data.url("chrome/font/Roboto-Regular.ttf") + ";}",
        ".genie_watch_popup{background-image: url(" + self.data.url("chrome/images/watch-popout2.png") + ");}"
    ],
    contentScriptWhen: 'end'
});

这是style.css

中相反的CSS

.genie_watch_popup{
    /*background-image: url('chrome-extension://__MSG_@@extension_id__/images/watch-popout2.png');*/
    background-repeat: no-repeat;
    background-position: center center;
    width: 225px;
    height: 209px;
    color:cecece;
    font-size:11px;
    position: absolute;
}

我所包含的字体正在运行。但背景图像没有显示出来。有人能帮我吗？还有其他方法我可以包括背景图像。

使用内容脚本无法正常工作的Firefox插件背景图片

0 个答案: