Inject CSS в firefox add on sdk

Question

Мне не удалось добавить CSS в расширение Firefox. Вот мой код.

var tbb = require('toolbarbutton').ToolbarButton({ 
    id: 'button', 
    label: 'us-button', 
    image: self.data.url('img/on.png'), 
    onCommand: function() { 

    tabs.activeTab.attach ({ 

     contentScriptFile: [ 
      self.data.url('jquery/jquery.min.js'), 
      self.data.url('jquery/jquery-ui.js'), 
      self.data.url('recuperation.js'), 
      self.data.url('dialog.js') 
     ], 
     contentStyleFile: self.data.url('jquery/jquery-ui.css'), 

Я использую toolbar buttons от Erik Vold. contentStyleFile, похоже, не работает. Когда я нажимаю на кнопку, появляется диалоговое окно JQuery, но без файла css.

Answer 1

Вы можете уйти с помощью PageMod, который принесет вам таблицу стилей и вы также можете ввести JavaScript.

Что-то подобное может работать:

var pm = require("sdk/page-mod").PageMod({ 
    include: tabs.activeTab.url, 
    attachTo: ["existing", "top"], 
    contentScriptFile: [ 
    self.data.url('jquery/jquery.min.js'), 
    self.data.url('jquery/jquery-ui.js'), 
    self.data.url('recuperation.js'), 
    self.data.url('dialog.js') 
    ], 
    contentStyleFile: self.data.url('jquery/jquery-ui.css') 
}); 

Позже вы хотите, чтобы уничтожить эту PageMod, когда вы сделали с ним, чтобы они не просто висят вокруг приложенных к старым страницам.

pm.destroy();