Drupal 5: Creating an animated search link form
Today, I was trying to figure out where to fit the search form into my theme without taking up space. I already had some links in the top right corner of the theme with some available space underneath them. I decided to add a Search link that toggles a fadeIn/fadeOut transition of a search form. Here’s the code in a nutshell:
<?php
// ...code...
$html .= l('Search', 'search', array('id' => 'searchLink'));
$html .= "<div id='searchLinkForm' style='display: none;'>" . drupal_get_form('search_block_form') . "</div>";
$js = "
  $(document).ready(function(){
    $('a#searchLink').toggle(
      function() {
        $('div#searchLinkForm').fadeIn('slow');
      },
      function() {
        $('div#searchLinkForm').fadeOut('slow');
      }
    );
  });
";
drupal_add_js($js, 'inline');
// ...code...
?>