Maybe by following this can get your desired result
$("#Button1").click(
function(){
// Hide Form2 if necessary
$("#Form2:visible").slideUp();
setTimeout(function(){$
("#Form1:hidden").slideDown();},1000)
// Don't follow the click
return false;
});
// Show Form 2
$("#Button2").click(
function() {
// Hide Form1 if necessary
$("#Form1:visible").slideUp();
setTimeout(function(){$
("#Form2:hidden").slideDown();},1000)
// Don't follow the click
return false;
});
On Jul 13, 10:40 am, navvywavvy <[EMAIL PROTECTED]> wrote:
> I've got two forms. When the page loads, both of the forms are hidden
> from view with display: none;.
>
> When Button1 is clicked, I want Form1 to appear.
> When Button2 is clicked, I want Form2 to appear.
>
> If Form1 is visible and Button1 is clicked, I want Form1 to disappear
> and THEN I want Form2 to appear.
> If Form2 is visible and Button2 is clicked, I want Form2 to disappear
> and THEN I want Form2 to appear.
>
> I can't seem to find a way to make these chain properly. If one of the
> forms was visible from the get-go, it could work just fine, but
> because in the beginning they're both hidden, it won't work. Here is
> my code:
>
> // Show Form1
> $("#Button1").click(
> function(){
> // Hide the Form2 if necessary
> $("#Form2:visible").slideUp();
> $("#Form1:hidden").slideDown();
> });
>
> // Show Form2
> $("#Button2").click(
> function() {
> // Hide Form1 if necessary
> $("Form1:visible").slideUp();
> $("Form2:hidden").slideDown();
> });
>
> Obviously the reason they are not "chaining" is because they're not
> chained in the code, but if I did it like this:
>
> $("Form1:visible").slideUp(function() {
> $("Form2:hidden").slideDown();
>
> });
>
> I would have the problem that I mentioned above where Form2 would only
> appear if Form1 was already visible.
>
> So, how can I make this work?
