CODEWITHSUNDEEP
jquerywordpressjquery-ui
dabito
dabito

Reputation: 586

How to correctly include jquery-ui effects on wordpress

I've been trying to include the jquery ui effects (more specifically the shake effect) on my wordpress theme. So far, I've only been able to include the jQuery script, but I really have no clue where to place the ui scripts and how to enqueue them.

This is the code I have. It obviously doesnt work:

    <?php wp_enqueue_script("jquery"); ?>
<?php wp_enqueue_script("jquery-ui-core"); ?>
<?php wp_head(); ?>
<link rel="stylesheet" type="text/css" href="<?php bloginfo('stylesheet_url'); ?>" />
<script type="text/javascript">
    var $j = jQuery.noConflict();
    $j(document).ready(function() {
        $j("#manita-imagen").mouseover(function(){
            //$j(this).animate({ opacity: "hide" })
            // alert('asd');
            $j(this).effect("shake", { times:3 }, 300);
        });
    });

 </script>

Thanks for your help!

Upvotes: 2

Views: 14218

Answers (1)

Michal
Michal

Reputation: 13639

It might be possible that the jquery-ui-core included with wordpress does not include Effects. The documentation is unclear(http://codex.wordpress.org/Function_Reference/wp_enqueue_script#Default_scripts_included_with_WordPress) You might have to load a custom jquery-ui package from a url. Below will load full jquery UI from google cdn

<?php wp_enqueue_script("myUi","https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.8/jquery-ui.min.js"); ?>

You can also use the wp_enqueue_script($name, $src) function to load your own scripts.

Upvotes: 7

Related Questions