Question

Is it possible to slide a div up (closing it) but not completely ?

I mean, slide up but leave a little of that div displayed, is that possible ?

Thanks in advance,
mem

Answer 1

Something like this may work:

$("#div").toggle(
function(){
   $("#div").animate( { height:"500px" }, { queue:false, duration:500 });
},
function(){
   $("#div").animate( { height:"50px" }, { queue:false, duration:500 });
});

Instead of the 500px it can just be the original size of the div, and the 30px can be however much you want to show when it’s meant to be hidden.

Update from the comments

Here’s a fiddle showing that it can allow different heights if declared in a variable. And fading out after animation shouldn’t be a problem.

http://jsfiddle.net/Skooljester/HdQSX/

var divTest = $("#test").height();
$("#test").toggle(
function(){
   $("#test").animate({ height: divTest + 'px' }, { queue: false, duration: 500 });
},
function(){
   $("#test").animate({ height:'50px' }, { queue: false, duration: 500 });
});

#test {
  display: block;
  background: #FF0000;
  height: 500px;
  width: 300px;
}

<div id="test">Test</div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>