Question

I know how to toggle an entire div, however I only want to hide all but the top 10% or top 100px, for example. And then when the div is clicked, the entire div opens.

I thought I saw this a while ago, but can’t remember where.

Thanks.

$(document).ready(function() {
 // hides the slickbox as soon as the DOM is ready
  $('#slickbox').hide();

 // toggles the slickbox on clicking the noted link
  $('#slick-toggle').click(function() {
 $('#slickbox').toggle(400);
 return false;
  });
});

Answer 1

Your code should be something in the lines of:

$(document).ready(function() {
    // hides the slickbox as soon as the DOM is ready
    $('#slickbox').animate({height: '20px'});

    // toggles the slickbox on clicking the noted link
    $('#slick-toggle').click(function() {
        $('#slickbox').animate({height: '100%'});
        return false;
    });
});