user2094477
user2094477

Reputation:

Jquery .toggle two divs with one sliding down and one sliding up, then vice versa the second time

I've used jQuery to construct a basic div swap. I am having a problem using .toggle to make this action reversable. When clicking the virtual tour button, found below the slideshow on the right hand side of the page, it is doing exactly what I would like it to do. I would like to make it so when the button is pressed again, the virtual tour switches back to the featured image using the same slide effect. I'm sure this is possible.

Anyone have any suggestions?

Here is my current jQuery code

<script type="text/javascript">
    jQuery(document).ready(function() {
    jQuery('.virtual-tour-hide').hide();
        //toggle the componenet with class msg_body
        jQuery('#mulberry-tour').click(function()
        {
           $('#featured-img').slideUp(2000);
           $('.virtual-tour-hide').slideDown(3000); 
        });
    });
</script>

Upvotes: 0

Views: 1266

Answers (1)

Sudz
Sudz

Reputation: 4308

jQuery(document).ready(function() { 
    jQuery('.virtual-tour-hide').hide();

    jQuery('#mulberry-tour').click(function()
    {
       $('#featured-img').slideToggle(3000) ;
       $('.virtual-tour-hide').slideToggle(3000); 

    }); 
});

Upvotes: 1

Related Questions