Mega Web Buttons Pack #1

Today we want to share our first set of easy-to-implement buttons called ‘Mega Web Buttons Pack’. In this set you will find 42 buttons which you can use easily on your website. We are using the WooFunction icon set released under the GNU General Public License. Our first step is to add […]

Today we want to share our first set of easy-to-implement buttons called ‘Mega Web Buttons Pack’. In this set you will find 42 buttons which you can use easily on your website. We are using the WooFunction icon set released under the GNU General Public License.

Our first step is to add the following line of jQuery:

$('.btn').append($('<span />').addClass('helper'));

This means that we will create a new ‘span’ element which is the holder for the button icon.

If, for example, you want to add the ‘Chart’ button you need to add markup to your website:

<a href="#" class="btn chart">Chart</a>

or the ‘Search’ button:

<a href="#" class="btn search">Search</a>

In the CSS you can change the looks by, for example, changing the background color:

Marcin is an experienced and creative web developer from Poland.
He loves putting new ideas into practice and is addicted to jQuery and CSS. Read his blog about web development here: http://www.jscraft.net.