how to integrate jpreloader for wordpress

Question

i use jpreloader for my html pages and after preload, i animate the sidebar (move in/out) and the content (fade in/out).

I integrated WP into my website as a part of blog and i would like to use the same : preloading at least the home page of WP blog and get in and out the sidebar (#secondary div) and fade in/out the rest (#primary div).

I use twentyeleven child theme, and the last version of WP (3.7.1). My blog page : http://webdesign.igorlaszlo.com/blog/

In the header.php before the , i linked the jquery file and the preloader script. In the footer.php before the tag, i called the script and animated the sidebar and content.

I does not work in WP (but works very well on my normal html pages in the other part of my website). So, i read an article here (Integrating JPreloader in wordpress) and added two lines into my functions.php too :

wp_register_script('jPreloader', get_template_directory_uri() . '/js/jpreloader.js', 'jquery', null, true);
wp_enqueue_script('jPreloader');

It does not work with it either...

Does someone know what i make wrong ?

Answer 1

So, there were more problems, if someone will have similar unanswered thing :

1) maybe maiorano84's answer helped because i changed my line as he said (i can not prove it).

2) i added all codes in the footer : i called first the jquery .js file, then the preloader .js file and after the code.

3) then, it started to work but never finished preloading and i had a "TypeError: jQuery.easing[jQuery.easing.def] is not a function" error. As far as i understood from some forums (and already had some similar problem before), WordPress comes already with jquery files and cause conflict with jquery of other plugins, i simply deleted the /wp-includes/js/jquery/ folder and i use my own jquery files... Remark : if you do not want to delete the folder, you can still try to change the l'occurence "$" or "jQuery" to "jq" (not using the same what WP default jquery uses).

Answer 2

You're using get_template_directory_uri in a Child Theme. From the Codex:

In the event a child theme is being used, the parent theme directory URI will be returned, get_template_directory_uri() should be used for resources that are not intended to be included in/over-ridden by a child theme. Use get_stylesheet_directory_uri() to include resources that are intended to be included in/over-ridden by the Child Theme.

Change it to this:

wp_register_script('jPreloader', get_stylesheet_directory_uri() . '/js/jpreloader.js', 'jquery', null, true);
wp_enqueue_script('jPreloader');