need jquery help

Question

i have a form which is displayed after every post, so i coded it in single.php, but the form is too long so i thought of putting it in jquery section, where if the user wants then he/she can click on open and the form will slide down for this purpose i used slide up/down jquery http : //api . jquery . com/slideDown/

i integrated the jquery in proper order in header.php, here is my header.php jquery code

<?php wp_enqueue_script("jquery"); ?>
<?php wp_head(); ?>
<script type="text/javascript" src="<?php bloginfo("template_url"); ?>/functions/js/jquery-1.4.4.js"></script>
      <script>
      $(document.body).click(function () {
      if ($("h6:first").is(":hidden")) {
      $("h6").slideDown("slow");
      } else {
      $("h6").hide();
      }
      });
      </script>
<?php woo_head(); ?>

and this is my single.php code,

`

<div class="post">
     <p><h6>
     <?php echo do_shortcode("[contact-form 2]"); ?></h6>
     </p>
     </div>

`

but after doing all this thing my sidebar i.e woo_tabs is not proper you can check the image http://i52.tinypic.com/2gxe90p.jpg

here my woo tabs instead of coming side by side, it is coming down, is my code right?

Answer 1

Trim your above code down to..

<?php wp_enqueue_script( "my_script", plugins_url( '/your-script-name.js', __FILE__ ), array( 'jquery' ) ); ?>
<?php wp_head(); ?>
<?php woo_head(); ?>

Place your jQuery into a JS file, then enqueue it with jQuery as a dependancy(as above), this will ensure jQuery is loaded before your script is. Your script also needs to use a no-conflict wrapper, and should be updated to read..

jQuery(document).ready(function($){
    $('a#my_id').click(function () {
        if($("h6:first").is(":hidden"))
            $("h6").slideDown("slow");
        else 
            $("h6").hide();
        return false;
    });
});

Or something to that degree..

NOTE: This is wrong..

<?php wp_enqueue_script("jquery"); ?>
<script type="text/javascript" src="<?php bloginfo("template_url"); ?>/functions/js/jquery-1.4.4.js"></script>

By doing that you're instructing WordPress to load the included version of jQuery, and then also including your own, so essentially you're loading two versions of jQuery(you only need one, i'd suggest the one WordPress ships with - per above suggested code).

Hope that helps.. :)

EDIT: jQuery updated inline with request in comments.

Accompanying HTML for link to work inline with jQUery.

<a id="my_id" href="#showform">My Special Link</a>

NOTE: I'm still unclear exactly what this jQuery needs to do for you, so i've simply updated the code posted earlier, i hope that's what you're aiming for... else please please clarify with more details.