0

I'm using colorbox plugin to create a modal dialog in certain pages. The dialog is created, but I lose all borders / background overlay of my CSS... In the google chrome console I get errors like:

https://www.website.com/br/cgi-bin/images/controls.png [404 not found]

https://www.website.com/br/cgi-bin/images/border.png [404 not found]

While the files 'controls.png' and 'border.png' are in the local directory of the extension/css...

I'm injecting the CSS over content_script of Google Chrome Extension. Manifest:

  "content_scripts": [
  {
    "matches": ["<all_urls>"],
    "css": ["colorbox.css"],
    "js": ["jquery.min.js", "jquery.colorbox.js", "dominteract.js"],
    "run_at": "document_end",
    "all_frames": true
  }],

I note that in the CSS source code the images are linked this way:

cboxOverlay{background:url(images/overlay.png) repeat 0 0;}

How can I declare this directory to the chrome's extension know this is a local directory and not a remote?

4

1 に答える 1

1

画像をリンクするには、次のように拡張機能のディレクトリを含める必要があります。

background:url('chrome-extension://__MSG_@@extension_id__/images/overlay.png') repeat 0 0;

次のように、イメージを web_accessible_resource としてマニフェストに追加する必要がある場合があります。

"web_accessible_resources": [
    "images/overlay.png"
]
于 2013-10-25T13:21:05.653 に答える