setInterval(失敗)

opacity(alpha)を、ロールオーバー/アウトで0.20-1.00の範囲で変更

問題点

同じIDのsetIntervalなら、上書き処理されるものだと思っていた。

しかし実際は前に呼び出した処理が終わらなくても何個もalphaSet1を呼び出すようで
マウスをのっけて(ロールオーバー)opacityが0.2になる前にマウスアウト(ロールアウト)させると
opacityを1.00に戻す処理も同時に動いて、お互いが引っ張り合う形になり失敗。

IDて何の為にあるんだろう?

window.onload=function(){
_bt1=document.getElementById("bt1");
_ta1=document.getElementById("ta1");

nowA1=100;
_ta1.value=nowA1;
dec=0.2;//減速
maxA=100;//最大アルファ
minA=20;//最小アルファ
reftime=20;//リフレッシュタイム:ミリ秒

//現在のalphaを、targetAlphaに近づける関数1
function alphaSet1(targetA1){
nowA1+=(targetA1-nowA1)*dec;
if(Math.abs(nowA1-targetA1)<1){
nowA1=targetA1;
clearInterval(aID1);
}
var alpha = parseInt(nowA1);
_bt1.style.opacity = alpha/100;
_ta1.value=alpha/100;
}

//マウスオーバー1
_bt1.onmouseover=function(){
aID1=window.setInterval(function(){
alphaSet1(minA);
},reftime);
}

//マウスアウト1
_bt1.onmouseout=function(){
aID1=window.setInterval(function(){
alphaSet1(maxA);
},reftime);
}

}