• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 372
  • Last Modified:

JQUERY Toggle Div Issue

I am trying to toggle one div, but the collapse keeps coming up short due to a div to the right. How do I get the div to collapse all the way to the top. I am using the gumby framework as well. So what I'm looking for is for the "1. Shipping Information" div to collapse up and the "2. Billing Information" div below it to rise up to be just underneath the collapsed "Shipping Information" div, but the "Checkout Progress" div to the right gets in the way and the "2. Billing Information" stops right below that. Here is the general code:

   
<div class="row">
    	<div class="nine columns">
    		<div id="shipdiv">
    
    			Shipping Information Content
    
    		</div>
    	</div>
    
    	<div class="three columns">
    		<div>
    
    			Checkout Progress Content
    
    		</div>
    	</div>
    </div>
    
    
    
    <div class="row">
    	<div class="nine columns">
    		<div id="billdiv">
    
    			Billing Information Content
    
    		</div>
    	</div>
    
    	<div class="three columns">
    		<div>
    
    			Blank Content
    
    		</div>
    	</div>
    </div>

Open in new window



   
 <script>
    $( "#hide-ship" ).click(function() {
    $( "#shipdiv" ).toggle( "slow" );
    $( "#billdiv" ).toggle( "slow" );
    });
 

   </script>

Open in new window


Example Image
0
seeraig
Asked:
seeraig
1 Solution
 
GaryCommented:
Because you have the shipping and side bar in their own row and the billing in another row.
Just move the billing bits inside the same row under shipping.;
0
 
seeraigAuthor Commented:
thanks, that worked, simple, just missed it.
0

Featured Post

Free Tool: ZipGrep

ZipGrep is a utility that can list and search zip (.war, .ear, .jar, etc) archives for text patterns, without the need to extract the archive's contents.

One of a set of tools we're offering as a way to say thank you for being a part of the community.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now