Today I came across this story from smashingmagazine.com that shows you how to create content panels.
We’ve called them an ‘opening and closing panel’ so far, but they are also described as expansion panels, or more simply, expanding panels. To clarify exactly what we’re talking about, head on over to this example on CodePen: Easy show/hide drawer (Multiples) by Ben Frain on CodePen. Easy show/hide drawer (Multiples) by Ben Frain on CodePen. That is what we’ll be building in this short tutorial. From a functionality point of view, there are a few ways to achieve the animated open and close that we are looking for. Make Your Own Expanding And Contracting Content Panels
thumbnail courtesy of smashingmagazine.com