CSS - Social Sprites Icons - CodeCanyon
Social Sprites Icons his title this type of CSS/Buttons This time I will review,made by IamShipon1988, CSS/Buttons is sold at a price of $2 in CodeCanyon.
button // css // facebook // fireworks // icon // media // social // sprite // sprites // twitter // | Created | 5 November 12 |
| Last Update | 4 June 13 |
| Compatible Browsers | IE8, IE9, Firefox, Safari, Opera, Chrome |
| Software Version | CSS3 |
| Files Included | HTML, CSS, Layered PNG |
INTRODUCTION
Social Sprites Icons is a set of commonly used social icons that transition using CSS ease. This set is super lightweight and could easily be integrated into any website. There are two versions for the icons. One with white background for normal state and a transparent background version. On hover, the icons background color will change to the official color of the social network. All of the icons are in one sprite png that totals 26.1 KB.
EXTENDED LICENSE
The extended license follows the terms set forth by Envato. These terms can be found by clicking here. Additionally, these special conditions apply:- The icons can be used on templates that are sold on the web.
- The icons cannot be resold separately.
- The icons cannot be given out for free after purchase.
- The icons can only be used on one template that is being sold per license. For additional license, please contact us via e-mail address found in the downloadable archive after purchase.
HOW TO USE
Using social sprites icons set is fairly simple. To integrate it to your website, all you need to do is call out of social sprite un-ordered list. To make it un-intrusive, we named this class SS.
Social Sprites – 40px by 40px Icons
<ul class="ss"> <li class="facebook"><a href="#">facebook</a></li> <li class="dribbble"><a href="#">dribbble</a></li> <li class="twitter"><a href="#">twitter</a></li> </ul>
Social Sprites Mini – 30px by 30px Icons
<ul class="ssm"> <li class="facebook"><a href="#">facebook</a></li> <li class="dribbble"><a href="#">dribbble</a></li> <li class="twitter"><a href="#">twitter</a></li> </ul>
DEMO & WATERMARK
You can view the live demo of this file by clicking ‘Live Preview’ from above. We also have a video of the file without the watermark available at http://www.screenr.com/Wa68.On the demo you will see some white text over the buttons. Those are watermarks to prevent people from stealing the content. Sorry for the trouble this may have caused you.
FILE SUPPORT
If you require any support, please post in the comment section or look in the “Thank You.pdf” file included in the archive.
FILE UPDATE
Update 2.3 – 06/03/2013- Update to Twitter icon
- Added 7 new icons: Github – Behance – Yelp – Mail – Instagram – Foursquare – Zerply
- Circle icons option was added. To add circle icons, you just have to add the sscircle class to your
- tag. Furthermore, you no longer have to use a container class as before. You can simply use the borderless class directly into the ul tag. In example, for the normal sized icons, you will use:
<ul class="ss borderless sscircle"> ... </ul>Update 2.1 – 11/15/2012
- IE bug fixes (added IE conditional)
- Edge fix on mini icons (removed blurriness for two icons)
- Added Social Sprites Mini (30px by 30px)
- Clean up of PNG
- Added extended license for use in commercial themes
- Added less intrusive watermark on the ‘Live Preview’
- Update to the math
Related produck This user:IamShipon1988
No comments:
Post a Comment