Jquery no works into wordpress

Question

I use wordpres and by default load the library of the core of jquery load it´s this :

js/jquery/jquery.js?ver=1.8.3

When i go for insert my own script of jquery the result it´s no works , things very easy as this code for example no works :

$(document).ready(function(){

$("#header_sun").fadeIn(4000).delay(4000).fadeOut(4000);
$("body").css("background","#C3DAEC");

});

The example of my code only works if i put in the head of wordpress this :

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

If i put this code until the core jquery of wordpress all my scripts created in jquery works and if no put this no works , i don´t understand why happen this because the jquery i put until of jquery version of core it´s the same but the version minimun

It´s very strange this i try all and don´t understand why no works ok my code and only works if i put or i call the remote library of jquery and no works with the load jquery of wordpress

Regards !

Am I right, that you are trying to load jquery through wordpress AND by inserting your own script tag? — 23tux, May 14 '13 at 08:52
Find the browser's JavaScript error console. What errors do you see there? — JJJ, May 14 '13 at 08:53
Please look at the related questions on the right side of this page. This has been asked many times before, for example http://stackoverflow.com/questions/3744348/jquery-not-working-in-wordpress. jQuery runs in [`.noConflict()`](http://api.jquery.com/jQuery.noConflict/) mode in WordPress. — andyb, May 14 '13 at 08:54
Yes i create separated document of jquery and put my script and use for load wp_enqueue_script , i see into the DOM and load perfect and only owrks if i put until the remote load of jquery and if no put this no works — user2290790, May 14 '13 at 08:54
Type `jQuery` into the javascript console in firebug or chrome web inspector and see if it is defined. — benastan, May 14 '13 at 08:55

Anthony Grist · Answer 1 · 2013-05-14T09:00:52.397

I'm not that familiar with Wordpress, but I believe it loads its own version of jQuery in "no conflict" mode, which means that you can't use the $ shorthand for jQuery (there are other JavaScript frameworks which also use $). What you can do is use an immediately invoked function expression to allow you to do that, though:

(function($) {
    // $ refers to jQuery only inside here
    $(document).ready(function(){
        $("#header_sun").fadeIn(4000).delay(4000).fadeOut(4000);
        $("body").css("background","#C3DAEC");
    });
})(jQuery);

This is the same as the syntax used when developing jQuery plugins, since you can't guarantee that $ will refer to jQuery.

score 0 · Answer 2 · answered May 14 '13 at 08:56

0

Try it,

jQuery(document).ready(function(){
   jQuery("#header_sun").fadeIn(4000).delay(4000).fadeOut(4000);
   jQuery("body").css("background","#C3DAEC");
});

Because, there may be more libraries like prototype,mootools,etc. used in wordpress so there can be confliction of $.

answered May 14 '13 at 08:56

Rohan Kumar

40,431
11
76
106

I try this and nothing only works if i put in the head and until the jquery library load default this no works nothing with the jquery library load with wordpress by default – user2290790 May 14 '13 at 08:59

score 0 · Accepted Answer · answered May 14 '13 at 09:04

0

I guess that your code is conflicted by jquery in wp-head()

insert this code in functions.php

function fix_noconflict() {
    wp_deregister_script( 'jquery' );
    wp_register_script( 'jquery' , 'http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' );
}
add_action( 'wp_enqueue_scripts' , 'fix_noconflict' );

answered May 14 '13 at 09:04

Ehsan

2,273
8
36
70

if it's ok please give me a (+) – Ehsan May 14 '13 at 09:26

score 0 · Answer 4 · answered May 14 '13 at 09:31

Have a look in your debugger console, I'd imagine you're getting a 'jQuery is not defined' error?

If so, it sounds like a conflict issue with jQuery, as Wordpress loads jQuery too using no conflict. Using $ instead of jQuery could cause issues with other librares which also use the $. You will need to add a no conflict function, then place your jQuery within it.

jQuery.noConflict();
(function($) {
  $(function() {
    //You can use $ here.
  });
})(jQuery);
// If you have any, your other non jQuery code which uses $ also, can go after here as normal.

Jquery no works into wordpress

4 Answers4