Here's a perfect example of the way jQuery makes things so easy, even a caveman programmer can do it.
In Cartweaver, the default Customer Login form is actually two separate forms - one to log in, and one to recall a forgotten password by entering an email address.
I have tried various rearrangements of the default markup on this page for each site I've done, always trying to give the more important 'log in' form a more visible presence than the 'forgot pw' form, without cluttering up the page.
Tonight, i found a solution i like best of all ... hide the forgot pw form altogether, using a simple link to show it if needed.
Really simple, actually. First, give the form a unique ID. Mine looks like this
<form action="<cfoutput>#request.ThisPage#</cfoutput>" method="post" name="getForgotPW" id="getForgotPW">
Then, set up the link...
<p id="forgotpw-link" style="display:none">
<a href="#">Did you forget your password?</a>
Now, a few simple lines of jQuery code. ( You'll also need a copy of jquery.js linked from your page head)
// forgot pw
Very simple - hide the form, show the link. When the link is clicked, hide the link, show the form.
Here is a working example: https://www.thunderbirdfoundation.com/OrderForm.cfm