[crx] Trying to use jQueryUI in content script

474 views
Skip to first unread message

gtorodelvalle

unread,
May 6, 2010, 2:35:40 PM5/6/10
to Chromium-extensions
Hi,
I am having some trouble getting jQueryUI to work in a Google Chrome
extension I am currently building. This extension uses a content
script to show a jQueryUI accordion on certain pages. jQueryUI themes
use the CSS url() construction to reference the icons used by the
theme.
The problem is that the url() construction is relative to the page
where the style is being applied and not to my extension content
script where the CSS file and its images are located. Is there any
workaround to this issue? Or more directly: has anyone managed to use
jQueryUI widgets in a content script? How? ;-)

Thank you very much.

Best,
Germán.

--
You received this message because you are subscribed to the Google Groups "Chromium-extensions" group.
To post to this group, send email to chromium-...@chromium.org.
To unsubscribe from this group, send email to chromium-extens...@chromium.org.
For more options, visit this group at http://groups.google.com/a/chromium.org/group/chromium-extensions/?hl=en.

gtorodelvalle

unread,
May 7, 2010, 5:05:21 AM5/7/10
to Chromium-extensions
Hi,

It seems I managed to get a preliminary solution to this problem
although it is not the best one, it works ;-)

Basically, it consists on editing the jquery-ui-1.8.1.custom.css of
the jQueryUI theme and substituting all the occurrences of the url()
construction using relative paths with absolute online paths. As an
example, subtitute "url(images/ui-bg_highlight-
soft_100_eeeeee_1x100.png)" with "url(http://jquery-ui.googlecode.com/
svn/tags/1.8.1/themes/ui-lightness/images/ui-bg_highlight-
soft_100_eeeeee_1x100.png)" using the files from the jQueryUI
subversion site. As you can see, you only have to put "http://jquery-
ui.googlecode.com/svn/tags/1.8.1/themes/ui-lightness/" in front taking
into account the concrete theme you are using or want to use ("ui-
lightness" in this case).

In case I find a better solution, I'll let you know. Please, do the
same ;-)

Best,
Germán.

On May 6, 8:35 pm, gtorodelvalle <gtorodelva...@gmail.com> wrote:
> Hi,
> I am having some trouble getting jQueryUI to work in a Google Chrome
> extension I am currently building. This extension uses a content
> script to show a jQueryUI accordion on certain pages. jQueryUI themes
> use the CSS url() construction to reference the icons used by the
> theme.
> The problem is that the url() construction is relative to the page
> where the style is being applied and not to my extension content
> script where the CSS file and its images are located. Is there any
> workaround to this issue? Or more directly: has anyone managed to use
> jQueryUI widgets in a content script? How? ;-)
>
> Thank you very much.
>
> Best,
>                      Germán.
>
> --
> You received this message because you are subscribed to the Google Groups "Chromium-extensions" group.
> To post to this group, send email to chromium-extensi...@chromium.org.
> To unsubscribe from this group, send email to chromium-extensions+unsubscr...@chromium.org.

Michael

unread,
May 17, 2010, 5:50:10 PM5/17/10
to Chromium-extensions
Check out the source to AdBlock (chromeadblock.com) -- I use Dialog
and Slider. The trick in is the load_jquery_css() function which I
believe is defined in blacklister.js -- feel free to copy it for your
own use :) That function pulls the required .css files onto the page
and then calls a callback to be run upon completion; when I want to
use jquery I call load_jquery_css() first and I'm good to go.

Hope this helps,
Michael
Reply all
Reply to author
Forward
0 new messages