Sliding Clipboard / Whiteboard - Only CSS
A Whiteboard with CSS3 Sliding effect and Checkbox based on a Vector Tutsplus Tutorial. The effect is achieved using the checkbox
hack where the checkbox
is hidden behind the opener by setting its opacity
to 0
. When the opener / checkbox
is clicked or checked
, the height of the content area is increased and the checkbox's position is changed so that it moves with the opener. The animation is achieved by using CSS3's transition
property which isn't supported by Internet Explorer yet so the demonstration will look great only in webkit based browsers, firefox and opera.
Feel free to look at the code to learn more about the creation.