ปุ่มกด 3 สถานะ สไตล์ Windows XP เมื่อเมาส์อยู่บน เมื่อกดเมาส์ และ เมื่อเมาส์ออกจากปุ่ม

<style type="text/css">
div.button { 
  padding:3px;
  float:left;
}
div.hover { 
  background:#D3E4F5;
  border:1px solid #167FB2;
  cursor:hand;
  padding:2px;
  float:left;
}
div.select { 
  background:#F0F0F0;
  border:1px solid #666666;
  cursor:hand;
  padding: 2px;
  float:left;
}
</style>

<script type="text/javascript"> function button_over( btn ) {   btn.className="hover"; } function button_out( btn ) {   btn.className="button"; } function button_down( btn ) {   btn.className="select"; } function button_click(val) {   alert(val); } </script>

<div onclick="button_click('Correct');" onmouseover="button_over(this);" onmouseout="button_out(this);" onmousedown="button_down(this);" onmouseup="button_over(this);" class="button"><img src="../../skin/img/correct.gif" alt="" /></div> <div onclick="button_click('Incorrect');" onmouseover="button_over(this);" onmouseout="button_out(this);" onmousedown="button_down(this);" onmouseup="button_over(this);" class="button"><img src="../../skin/img/incorrect.gif" alt="" /></div>


[ex=ex/xhtml/xpbutton,100%,50]