JavaScript $ is not defined

Question

I'm trying to paste in some code from codemyui.com into my website, but it looks like there's an error in the javascript. Can someone more familiar with javascript help me?

https://codepen.io/nenadkaevik/pen/odyrGm

var tabs = $('.tabs');
var selector = $('.tabs').find('a').length;
//var selector = $(".tabs").find(".selector");
var activeItem = tabs.find('.active');
var activeWidth = activeItem.innerWidth();
$(".selector").css({
  "left": activeItem.position.left + "px", 
  "width": activeWidth + "px"
});

$(".tabs").on("click","a",function(e){
  e.preventDefault();
  $('.tabs a').removeClass("active");
  $(this).addClass('active');
  var activeWidth = $(this).innerWidth();
  var itemPos = $(this).position();
  $(".selector").css({
    "left":itemPos.left + "px", 
    "width": activeWidth + "px"
  });
});

Dreamweaver says that in line two selector is assigned a value but never used and CodePen says that $ is not defined in the same place.

Have you linked jQuery? Pretty sure the dollar signs are from the jQuery library. — , Feb 25 '21 at 19:31
Click on JS, Settings and see they include jQuery like this: `` Put it in the head right after your title tag — mplungjan, Feb 25 '21 at 19:33
See the answer below I updated with the picture Just copy my tags above to your HTML page — mplungjan, Feb 25 '21 at 19:36
Also right click on the rendered part and view frame source - there you will see they have the script tag embedded: `view-source:https://cdpn.io/nenadkaevik/fullpage/odyrGm` — mplungjan, Feb 25 '21 at 19:38

score 0 · Answer 1 · answered Feb 25 '21 at 19:31

0

$ is the abreviation of jQuery, you need to import de CDN script of jQuery into your scripts in order to make it work.

answered Feb 25 '21 at 19:31

m4el

455
1
4
14

score 0 · Answer 2 · edited Feb 25 '21 at 19:35

0

You can use the codepen settings to add the reference to the jQuery library. Click on the settings icon. Go to 'Add External Scripts/Pens' and choose the jQuery cdn link.

edited Feb 25 '21 at 19:35

mplungjan

169,008
28
173
236

answered Feb 25 '21 at 19:32

Ran Turner

14,906
5
47
53

If you choose it and click save and close the code pen project will import it for you. – Ran Turner Feb 25 '21 at 19:46
@mplungjan Thanks! That looks much better on the code pen, but I'm still getting that error in my text editor "selector is assigned a value but never used" – iWyn Feb 25 '21 at 19:51
And it isn’t so comment it out -the line starting `var selector...` – mplungjan Feb 25 '21 at 20:00
1

@mplungjan that simple, huh? Thanks for all the help. – iWyn Feb 25 '21 at 20:06

JavaScript $ is not defined

2 Answers2