Examples of CSS ToolTips!

This is my take on the script found at Six Revisions. I have revised the code to allow for some transitions in the CSS-only tooltips that will work for webkit browsers only, but allow for a nicer transition for the tooltips rather than just appearing and disappearing instantly. The reason why they don't fade out as well as they fade in is because when you mouseout the margin value is switched instantly, so you never see the fade out. I have created two alternatives that transitions from the left and top too.

Remember: tooltips on this page have been created using only CSS! (You can view the page source to see how it's done).

Here are some examples of a ClassicThis is just an example of what you can do using a CSS tooltip, feel free to get creative and produce your own!:

This is just an example of what you can do so feel free to get creative and produce your own!