Using Sprite Images with <input type="image" /> for a Hover Effect

By Josh Stodola

Download the Code

Demo

Markup

<div id="submitButton">
  <input type="image" src="submit.png" alt="Submit Form" />
</div>

CSS

#submitButton {
  cursor:pointer;
  height:40px;
  overflow:hidden;
  width:200px;
}

#submitButton:hover input {
  margin-top:-40px;
}