給按鈕加hover，發現有很多種方法，小試三種，測試后發現都OK，留在此地作一個備忘。
1.直接改變背景圖片
obj.style.backgroundImage="url(btnSmall.gif)";
2.改變CSS
obj.style.cssText= "background:url('btnSmallHover.gif')";
3.jquery的hover
jquery.hover(function(){},function(){});
示例代碼如下圖所示：
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script> <script>
//改變背景圖片
function m(obj,type)
{
switch(type)
{ case 'out':
obj.style.backgroundImage="url(btnSmall.gif)";
break;
case 'over':
obj.style.backgroundImage="url(btnSmallHover.gif)";
break;
}
}
//改變cssText
function mCss(obj,type){
switch(type)
{
case 'out':
obj.style.cssText= "background:url('btnSmall.gif')";
break;
case 'over':
obj.style.cssText= "background:url('btnSmallHover.gif')";
break;
}
}
//使用jquery
$(function(){
$('#c').hover(
function(){ $(this).addClass("hover");},
function(){ $(this).removeClass("hover");}
);
})
</script>
<style>
button{border:0;width:82;height:40;background: url("btnSmall.gif");}
.hover{background:url( 'btnSmallHover.gif');}
</style>
</head>
<body>
<button onmouseover="m(this,'over');" onmouseout="m(this,'out');">確定1</button>
<button onmouseover="mCss(this,'over');" onmouseout="mCss(this,'out');">確定2</button>
<button id="c">確定3</button>
</body>
</html>