All geek questions in one place

Why is my jQuery UI CSS not working in JSFiddle?

To answer questions using JavaScript input, I often use Demos on JSFiddle . This is very useful, but when I answered this prompt , I needed to use jQuery UI .

The problem with this use is that you can check the jQuery user interface in choosing Framework, but it only loads the js file, not the css files.

So, I decided to link this http://jqueryui.com/themes/base/jquery.ui.all.css used in official jQuery UI demos. => The problem is resolved.

Really resolved? Not?!

Since this link works fine if the user opened the jQuery demo before, but as I saw here, it doesn’t work in my work if I only open the script without opening any demos.

  • Why is this?
  • And how can I solve this problem?
  • How do I bind css in jsFiddles for jQuery? Googles CDN also contains only JavaScript files.

I don't want to host my own css file, just to host a demo on jsfiddle ...

PS: JSFiddle, where I mentioned this behavior, http://jsfiddle.net/neysor/r9yfw/

+6
source share
2 answers

Nayzor, my sincere apologies - I was an idiot.

I really see the same problem and don't get CSS, and I think I found the problem.

It seems that jqueryui.com can do a referrer check against the request and return 403 to those outside the domain (which makes sense). This is why it works when you view user interface elements in another window, since then CSS will be cached.

Make it work pl0x!

If you open the "Resource Management" tab and delete "jquery.ui.all" and replace it with http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/base/jquery-ui.css , everything should work well (or at least better). Do this for any / all CSS resources.

I forked jsFiddle and saw some improvements.

It might be worth checking with jsFiddle docs if you have a complete solution to see if we can get this documented (or, fixed!)

Hope this helps!

+3
source
Documentation

jsfiddle includes this in the "Add Resources" section:

Warning: jsFiddle recognizes the type of resource using the extension. If you want to use a dynamic resource, add the dummy GET variable, i.e. http://example.com/download/js/dynamically.js?somevar=somevalue&dummy=.js This will cause jsFiddle to recognize it as a JavaScript resource.

Does not predict your problem or your workaround, but worth a try (with dummy=.css ).

0
source

Source: https://habr.com/ru/post/915066/

More articles:


All Articles