Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 2 of 2
  1. #1
    Member UNarmed's Avatar
    Join Date
    Sep 2008
    Posts
    90
    Member #
    17377
    Hey i am trying to use jquery to swap out two divs depending on which button a user clicks. Here is the jquery i am currently using but the problem is that this opens up the divs below one another if both buttons are clicked. Here is a example of what i need it to do.

    e.g
    Click button A - Div A opens and div B closes (if it happens to be open)
    Click button B - Div B opens and div A closes (if it happens to be open)

    Code:
    <script type="text/javascript">
    $(document).ready(function(){
    
        $(".Arrivals").click(function(){
            $(".ResultsArrivals").slideToggle("slow");
            $(this).toggleClass("AActive"); return false;
        });
        
        $(".Departures").click(function(){
            $(".ResultsDepartures").slideToggle("slow");
            $(this).toggleClass("DActive"); return false;
        });
        
         
    });
    </script>
    Much thanks =]

  2.  

  3. #2
    Member UNarmed's Avatar
    Join Date
    Sep 2008
    Posts
    90
    Member #
    17377
    I figured it out =]

    I dont know whether this is any good because its my first time writing my own jquery but it works like a charm so im happy with it

    Code:
    <script type="text/javascript">
    $(document).ready(function(){
    
        $(".Arrivals").click(function(){
            if ($(".Arrivals").hasClass("AActive")) {
            $(".ResultsArrivals").slideUp("slow");
            $(".Arrivals").removeClass("AActive");
            }
            else if ($(".Departures").hasClass("DActive")){
            $(".ResultsDepartures").slideUp(500);
            $(".ResultsArrivals").delay(600).slideDown(500);
            $(this).toggleClass("AActive");
            $(".Departures").removeClass("DActive");
            }
            else {
            $(".ResultsDepartures").slideUp(500);
            $(".ResultsArrivals").slideDown(500);
            $(this).toggleClass("AActive");
            $(".Departures").removeClass("DActive");
            }
        });
        
        $(".Departures").click(function(){
            if ($(".Departures").hasClass('DActive')) {
            $(".ResultsDepartures").slideUp("slow");
            $(".Departures").removeClass("DActive");
            }
            else if ($(".Arrivals").hasClass("AActive")){
            $(".ResultsArrivals").slideUp(500);
            $(".ResultsDepartures").delay(600).slideDown(500);
            $(this).toggleClass("DActive");
            $(".Arrivals").removeClass("AActive");
            }
            else {
            $(".ResultsArrivals").slideUp(500);
            $(".ResultsDepartures").slideDown(500);    
            $(this).toggleClass("DActive");
            $(".Arrivals").removeClass("AActive");
            }
        });
        
            $(".ClossResults").click(function(){
            $(".SResultsWrapper").slideUp(500);
            $(".Arrivals").removeClass("AActive");
            $(".Departures").removeClass("DActive");
            });
        
         
    });
    </script>


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 05:14 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com