Create a “Slot Machine” Hover Effect with CSS

Slot Machines

A client requested a “slot machine” hover effect for their social network buttons.  When you hover on the icon, it moves up, sort of like in a slot machine, and changes color.  Here’s an example of what I’m talking about: It turns out that this effect can be accomplished with some clever CSS!  No JavaScript … Read more

Dynamically Resize an iFrame Using jQuery

I was given the task to fix a website bug of the following nature:  There is an iframe containing a “submit” button.  When the Submit button is pressed, new content is loaded into the iframe and the size of the iframe gets much larger.  Unfortunately, the containing window does not get larger and ugly scroll … Read more

Add Your Website Icon to the Browser Tab

favicons

The cool little icon that shows up in each web page’s browser tab is called a “favicon”.  Adding this tiny detail really gives your website a professional appearance in the browser.  Here’s how to do it – and this works with older versions of IE, unlike other solutions I’ve found on the Internet!  If You’re … Read more

Make a Background of an Image Transparent

Often times you’ll have an image, perhaps a logo, that you want to use on a website, and you’ll want that image to have a transparent background.  Here’s how to make an image have a transparent background using a free drawing program called Paint.net (note this solution works on Windows only). 1. Download and Install … Read more

Add Custom Fonts to Your Website

Are you tired of using the same old boring web fonts?  Without describing all of the browser compatibility problems in detail, here’s a quick and dirty way to embed custom fonts in your websites.  This really takes the appearance of your site to the next level! First, you need a font.  A great source for … Read more