CODEWITHSUNDEEP
google-chrome-extension
crazybob
crazybob

Reputation: 2317

How to load JQuery ui into chrome extension content scripts?

I'm trying to load jquery ui into chrome extension.

I've succedded load jquery.js, jquery-ui.js and jquery-ui.css but when I open a dialog, the images of the dialog (like the x of close button) aren't shown and I get the warning:

Resource interpreted as Image but transferred with MIME type text/html: ...

I also tried to change the jquery-ui.css from images/image_name to chrome://extension/__extension__ID__/images/image_name. Then I get the error:

not allowed to load local resource: ...

What is the right way to do it?

My manifest.json looks like:

{
    "name": "my_extension",
    "version": "0.0.2",
    "description": "bla bla",
    "permissions": [
        "activeTab",
        "tabs",
        "http://*/"
    ],
    "background": { "scripts": ["background.js"] },
    "content_scripts": [ {
        "js": [ "jquery-1.10.2.js" , "jquery-ui-1.10.4.custom.min.js" ],
        "css": [ "jquery-ui-1.10.4.custom.min.css" ],
        "matches": [ "http://*/*", "https://*/*"]
    }],
    "web_accessible_resources": [
        "images/*"
    ],
    "browser_action": {
        "default_title": "Run",
        "default_icon": "Run.png"
    },
  "manifest_version": 2
}

Upvotes: 2

Views: 682

Answers (1)

Zig Mandel
Zig Mandel

Reputation: 19835

You need to make it a web_accesible_resource from the manifest and use chrome.extension.getUrl to get its actual url

Upvotes: 1

Related Questions