This cool animated share button transforms from one single element into four elements each representing a link to a social site! This Sharebar uses the following pseudo classes:

• :first-child:before
• :nth-child
• :last-child
• :hover

And some CSS, namely: box-shadow, transitions, border-radius, transform, and gradient background.

Click on the image to view the transitioning demo.

You can also CLICK HERE to experiment with this code, thanks to Piotr Zalewa and Oskar Krawczyk on jsfiddle!

Incoming search terms for the article:

• share bar css
• sharebar css
• social media sharebar psd
• sharebar jquery
• css sharebar
• css share bar
• sharebar
• share bar in html and css
• sharebar for html
• sharebar html css