... and this is how I'd go about it:
as with all my examples the directory:
is wide open for easy access to the gooey bits and pieces. I made the form use PROPER markup for a search form:
<form method="post" id="topSearch">
<input type="text" name="q" id="topSearchText" />
<input type="submit" class="submit" value="go" />
The script starts out with an anonymous function so other scripts won't clash with it. I added some simple class manipulating functions to make things easier without that fat bloated idiotic jQuery nonsense. The script should be loaded BEFORE </body> to make changes before rendering starts and to load faster.
The script adds the class "topSearchScripted" BEFORE onload so positioning can start and it's slid off the top of the screen. I added a more robust top calculation to the onscroll event since what you had would not work in anything but Gecko and Webkit based browsers. Instead of triggering a scripted animation, I simply do a class swap to let CSS do the real grunt-work. You just add or remove the "topSearchScrolled" class to set position:top to zero, then let CSS3 handle the animations. IE9 and earlier don't get the animation but still show/hide the menu bar, OH WELL.
IE6 it doesn't work at all since there is no position:fixed, so I used @cc_on and jscript version detection to return from the anonymous function prematurely -- so legacy IE gets the non-scripted version... on real versions; the 'emulation' modes in IE 9/10/11 do not report jScript versions properly.
Hope this helps.