Transform Images Into Sleek Spheres - Glossify.js

Transform Images Into Sleek Spheres - Glossify.js
File Size: 55.5 KB
Views Total: 1548
Last Update:
Publish Date:
Official Website: Go to website
License: MIT

Glossify.js is a fancy jQuery plugin that converts your images into sleek 3D spheres (with shadow and inner glow) using HTML5 canvas API. 

How to use it:

1. Download and load the glossify.js script after jQuery JavaScript library.

<script src="" 
<script src="js/glossify.js"></script>

2. Just add the data-gloss attribute to the images within the document and we're done.

<img src="facebook.png" data-gloss />
<img src="twitter.png" data-gloss />
<img src="instagram.png" data-gloss />
<img src="chrome.png" data-gloss />
<img src="firefox.png" data-gloss />
<img src="opera.png" data-gloss />

3. Customize the color using the data-glosscolor attribute:

<img src="facebook.png" data-gloss data-glosscolor="#265999" />
<img src="twitter.png" data-gloss data-glosscolor="#00b0ef" />
<img src="instagram.png" data-gloss data-glosscolor="#00749c" />

4. Customize the alpha using the data-glossalpha attribute:

<img src="chrome.png" data-gloss data-glossalpha="0.8" />
<img src="firefox.png" data-gloss data-glossalpha="0.8" />
<img src="opera.png" data-gloss data-glossalpha="0.8" />

This awesome jQuery plugin is developed by tinoni. For more Advanced Usages, please check the demo page or visit the official website.