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...
?>