html - jQuery: How to animate height change without known heights? -


I want to animate an altitude change (when I hide / divide shows) using jQuery. I found some examples on SO, but I can not get them to work.

Suppose I have a container with some divs in it.

HTML: 

  & lt; Div class = "container" & gt; & Lt; Div class = "first" & gt; First div & lt; / Div & gt; Show & Lt; Div class = "second" & gt; The second div & lt; / Div & gt; & Lt; Div class = "item1" & gt; Some text & lt; / Div & gt; & Lt; Div class = "item2" & gt; Some multiline & lt; Br / & gt; Text & lt; / Div & gt; & Lt; / Div & gt;  
  jQuery:   
  $ ('first'). ('Click', function () {$ ('.item2'). Hide (); $ ('. Item1'). Show ();}); $ ('. Seconds') ('click', function () {$ ('item1'). Skip (); $ ('item2'). Show ();}); 
  
 
  
  
 
 
 ITEM2 The height of these divs is different, which means that when I hide / display the divs, the shape of the container size  
 How can I change this height without knowing the shape of any div?  
 ps If there is a CSS solution, then it would be better if I do not think it is possible only with CSS Theo.   
 
 
 Using the optional parameters and, you can get the animation effect you want You can also pass  millisecond  as well. 
 
 Try, 
 
  $ ('first'). ('Click', function () ($ ('. Item2') hidden ('slow'); $ ('item1'). Show ('slow');}); $ ('. Second ('Slow'); $ ('item2') show ('slow');});   / Pre>

Comments

Post a Comment