Pure CSS3 Hidden Text Revealer
It's a nice liitle useful (in some cases) creation that can be used to hide some text in your content which can only be seen by users who are interested to see the hidden content. It's much similar to the IMDB's spoilers that hides the text and the hidden text is revealed when the user hovers the spoilers.
So, basically, the hidden text is contained under a span
tag that is hidden by default and the when the user hovers the paragraph, the display
property of the span
tag is set to inline
to reveal the tag. The span
tag is styled here to make the hidden content visible clearly and it can be changed according to the needs. Feel free to look at the code below and play with it as much as you like :)