Creating a Rollover Button without Javascript

JavaScript rollover buttons have been a common feature on the web for a long time now, but they do have some drawbacks. In the article below I will describe a way to make some neat looking rollover techniques with just XHTML and CSS. They aren't perfect for every situation, but they are an interesting alternative.

Why not just use MM_swapImage()?

Macromedia's (now Adobe's) ubiquitous JavaScript functions for rollovers are effective but they do have a few disadvantages:

What is Unit Testing?

In simple terms, unit testing is a definition of tests to run on your code. Usually, these tests are automated. The "unit" in unit testing means that the tests should test the smallest functional units, like functions or methods. However, unit testing does not have to be limited to only testing small parts; it can also test interactions between parts with complex combinations and variables, and even test some visual elements, like whether or not a certain image is actually shown or if a class was applied to an XHTML tag.

Here is another tip from "Mistakes I've Made". Don't mix up your conditions and assignments. In other words be careful about using assignment operators (like the eqauls sign '=') inside of conditional statements. Although this happened with PHP, the same problem can occur with many other languages. Let me explain...

Here is a very common way to loop:

Below you will find my description of how I made a new component for Drupal's webform module that dynamically displays a selection of checkboxes. I will go over why I made it. Then I will explain the code step by step. I have also attached a copy of the file for download.

Do you need to output a code sample onto an HTML page? Just copy the code into the box below, and press "Convert"

While making the first article in the "Mistakes I've Made" series. I immediately came across the fodder for the next. I was trying to create CSS for my code examples and discovered that using <pre /> just won't cut it anymore.

This is the first in a series of short articles called "Mistakes I've Made". In this series I plan to give examples of mistakes, misunderstandings, and problems I've encountered while coding. Maybe they will keep you from going through the same frustration.

I came across this "mistake" while making the new CSS for this site. Apparently, Internet Explorer only speaks American English. Here is the code I created: