Can't get both features to work

[leehughes]

Hi,

I have a jquery based feature in my sidebar at http://www.ephemeralproject.com/about/. This is set up with the following code

<script type="text/javascript" src="<?php echo get_bloginfo('stylesheet_directory') . '/custom/jquery-ui-personalized-1.5.2.packed.js' ?>"></script>

I also want to setup this http://css-tricks.com/rotating-feature-boxes/. I have the feature boxes working and everything is fine.

The only problem is that in order for the feature boxes to work on my site I need to add the following code into my head

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"></script> 

By adding this the feature box now works but the jquery from the sidebar does not work.

Can anyone advise me on how these can both work together?

Many thanks

[chris.upjohn]

jQuery already comes queued in WordPress's wp_head() function so there is no need to call it again, what i suggest you do is take advantage of wp_enqueue_script() which allows you to append your own scripts into the wp_head() function.

[leehughes]

Ahhh, got ya.

Sorry, too long on the comp

All working now

[leehughes]

D'oh, it wasn't working after all. The jquery for the feature box doesn't work like in this demo http://css-tricks.com/examples/RotatingBlocks/

function rotate() {
?>

    <script>
        // DOM Ready
        $(function() {
        
            var current;
                    
            function rotate() {
            
                // This seems like a sucky way to do it, but you can't select by classes because they execute in order
                            
                if (current == 1) {
                    $("#block-1").removeClass().addClass("active");
                    $("#block-2").removeClass().addClass("non-active-top");
                    $("#block-3").removeClass().addClass("non-active-bottom");
                } else if (current == 2) {
                    $("#block-1").removeClass().addClass("non-active-bottom");
                    $("#block-2").removeClass().addClass("active");
                    $("#block-3").removeClass().addClass("non-active-top");
                } else {
                    $("#block-1").removeClass().addClass("non-active-top");
                    $("#block-2").removeClass().addClass("non-active-bottom");
                    $("#block-3").removeClass().addClass("active");
                }
            
            }
            
            $("#rotator div").click(function() {
            
                // Enables reversing, idea via Andrea Canton: https://twitter.com/andreacanton/status/24954634279849985
                current = this.id.substr(6);            
                rotate();
            
            });
        
        });
    </script>
    
<?php
  
  }
add_action('wp_enqueue_scripts', 'rotate');