Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

I'm using javascript for the first time to do some simple animations on the home page of my website. So far I have added the following to my header.php file (which is only used for my home page), before the wp_head line.

<?php
function my_scripts_method() {
    wp_enqueue_script('jquery');            
}    

add_action('wp_enqueue_scripts', 'my_scripts_method'); // For use on the Front end (ie. Theme)
?>

It's loading jquery into my page! I only need it on the home page, which is why I'm not calling it in functions.php or whatever.

I just need to do some simple animations on my home page and need some advice. When the page loads, I want the logo to move down into position from off the top of the page, then I want the menu to appear underneath it using the Blind effect. When someone clicks a menu item I need the menu to hide using the blind effect, the background colour to change, the logo to move, and the logo to be transitioned from one png to another png (so that it appears to change color as well).

The codex (http://codex.wordpress.org/Function_Reference/wp_enqueue_script) says jQuery UI Effects is NOT included with the jquery-ui-core.

How do I get my page to load the jQuery UI Effects library?

Alternately, perhaps someone can offer advice on a better js file to use for this than jQuery UI Effects?

share|improve this question
    
The codex is out of date, jQuery UI Effects is included in WordPress 3.5. –  Otto Feb 22 '13 at 10:33

1 Answer 1

You can call scripts in your function to only load for the front or home page. The codex is not a very complete reference, to include the jQuery UI Effects core you can do the following:

wp_enqueue_script( 'jquery-effects-core');

Or you can iclude just the effects you want , such as:

 wp_enqueue_script( 'jquery-effects-blind');

Here is a reference to the jQuery effects names which you can enqueue:

  • jquery-effects-core
  • jquery-effects-blind
  • jquery-effects-bounce
  • jquery-effects-clip
  • jquery-effects-drop
  • jquery-effects-explode
  • jquery-effects-fade
  • jquery-effects-fold
  • jquery-effects-highlight
  • jquery-effects-pulsate
  • jquery-effects-scale
  • jquery-effects-shake
  • jquery-effects-slide
  • jquery-effects-transfer

To include it only for your font page you would do something like:

function my_scripts_method() {
    if ( is_front_page ) { 
    // make sure jQuery is loaded
    wp_enqueue_script('jquery-ui-core', '', '', array('jquery'));
    wp_enqueue_script('jquery-effects-core', '', '', array('jquery'));
    }
}
add_action('wp_enqueue_scripts', 'my_scripts_method');
share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.