Don't know which JQuery plug-in to use

Question

I have this piece of JS:

var count = $(".parent a").length;
$(".parent div").width(function(){
    return ($(".parent").width()/count)-5;
}).css("margin-right","5px");

But it doesn't seem to work on my website even though it works fine on JSFiddle

I used "http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"

But didn't work.

I don't have any other Script on my website as I've just started it.

Is it just a case of using the wrong plug-in?

UPDATE

This is my full code:

http://jsfiddle.net/WeQwc/9/

http://stackoverflow.com/questions/441412/is-there-a-link-to-the-latest-jquery-library-on-google-apis :) — nkmol, Oct 22 '13 at 08:05
The jQuery UI is only used for (as the name suggests) creating User Interfaces with jQuery, so tables, animations, widgets. As seen here: http://jqueryui.com/. jQuery itself is an extension library on top of javascript which allows you to do a lot of things a lot easier, as seen here: (http://jquery.com/) — Henk Jansen, Oct 22 '13 at 08:08
What does your console (like firebug) say? It will probably give you an error or warning — Martijn, Oct 22 '13 at 08:11

Hazza · Accepted Answer · 2013-10-22T09:25:42.347

1

You need jQuery, not jQueryUI.

http://code.jquery.com/jquery-latest.min.js

<script src="http://code.jquery.com/jquery-latest.min.js"></script>

<script type="text/javascript">
  $(function() {
    var count = $(".parent a").length;
    $(".parent div").width(function(){
        return ($(".parent").width()/count)-5;
    }).css("margin-right","5px");
  });
</script>

Just to clarify why this works, surrounding your jQuery code with the $(function(){...}); means that it will only be run once the page has finished loading. So if you are acting on html elements, this is kinda useful. You will notice that your jFiddle JavaScript is run "onLoad", the reason it worked :)

edited Oct 22 '13 at 09:25

answered Oct 22 '13 at 08:03

Hazza

6,441
3
24
37

How do I know which is the right one to use? and where to find it? Sorry I only really use HTML and CSS usually – SaturnsEye Oct 22 '13 at 08:04
1

You will always need the core jQuery library if you are using any jQuery plugins :) – Hazza Oct 22 '13 at 08:06
You're welcome, just added a little reasoning as to why this solved your problem – Hazza Oct 22 '13 at 09:26

palaѕн · Answer 2 · 2013-10-22T08:09:31.327

0

Currently you are using only the jQuery UI js file

http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js

You need to use the core jQuery min js file first and then the jQuery UI js file.

http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js
http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js

edited Oct 22 '13 at 08:09

answered Oct 22 '13 at 08:04

palaѕн

72,112
17
116
136

Thank's for the correction, but it's still not working. I've copied over all the code from JSFiddle as it works on there and double checked it for my site but it's not applying the JS – SaturnsEye Oct 22 '13 at 08:07
Include jquery file first then jquery UI – Ahmad Oct 22 '13 at 08:08
Please paste the HTML markup you are currently using in the site, in your question... If your site is public you can also share the link. – palaѕн Oct 22 '13 at 08:09

Don't know which JQuery plug-in to use

2 Answers2