0

So I've been trying to add a simple image slider into a page on my site. For some reason, it seems that jQuery isn't working at all when I try to call it.

Take a look at this page:

http://www.evanart.com/test/

Clicking the button brings up an alert, but that's just plain javascript. If you look in the source, i'm also trying to bring up an alert on pageload with jQuery, but nothing is happening. I'm running that script both in the post and in the head. There isn't anything wrong with the script itself- i've tried it on another site and it works fine.

So, jQuery isn't working. It seems like its linked just fine though. I also have some wordpress plugins running (a lightbox, a lazy loader, and an infinite scroll feature) which all work fine. What am i doing wrong??

dsgriffin
  • 66,495
  • 17
  • 137
  • 137
user2350756
  • 1
  • The accepted answer in the question above will solve your problem. – dsgriffin May 04 '13 at 21:17
  • Your page has `jquery "1.8.3"` and you should be using it with `jQuery` instead of `$` – Ejaz May 04 '13 at 21:18
  • Welcome to Stack Overflow! Here at Stack Overflow, code is usually favored over a link to a website, because once the link has changed, the question will no longer have historical value. Visit [here](http://stackoverflow.com/editing-help) for help with formatting code into your question. It may also be helpful to use a [jsFiddle](http://jsfiddle.net) to help illustrate your point. – Cody Guldner May 04 '13 at 21:31

2 Answers2

0

The jQuery library in wordpress doesn't declare $ as the jQuery variable.

If you want to use $ you can write your code inside of a anonymous function using $ as parameter and jQuery as a value:

(function ($) {

  // put the code that uses $ in here.

}(jQuery));

or, to match your code:

jQuery(document).ready(function($) {
  // put the code here
}(jQuery));
davidmh
  • 1,368
  • 13
  • 24
0

WordPress loads jQuery in no conflict mode to prevent issues with other libraries.

So you must use jQuery instead of $ in your code.

For example, I saw this in your page:

$(document).ready(function() {
   alert('hi');
});

For it to work, and still use the $ sign, you must use the jQuery noConflict Wrapper:

jQuery(document).ready(function($) {
   alert('hi');
});
RRikesh
  • 14,112
  • 5
  • 49
  • 70