[Javascript] - 레이어 Fade In & Fade Out
[Javascript] - 레이어 Fade in & 레이어 Fade out
----------------- 레이어 Fade in -----------------
<script language="JavaScript1.2">
i = 0;
function showlayer () {
if (i == 0) {
document.getElementById("Fade in될 레이어ID").style.display='block';
document.getElementById("Fade in될 레이어ID").style.opacity = 0;
document.getElementById("Fade in될 레이어ID").style.filter = "alpha(opacity=0)";
}
i = i + 25;
var op = i / 100;
//alert(op);
document.getElementById("Fade in될 레이어ID").style.opacity = 1 + op;
document.getElementById("Fade in될 레이어ID").style.filter = "alpha(opacity="+(0 + i)+")";
//alert(document.getElementById("Fade in될 레이어ID").style.filter);
if(i > 99){
clearInterval(tid);
i = 0;
//alert(i);
}
}
function show(){
tid = setInterval(showlayer,50);
}
</script>
onclick = "show();"
----------------- 레이어 Fade out -----------------
<script language="JavaScript">
i = 0;
function hideLayer () {
i = i + 25;
var op = i / 100;
//alert(j);
parent.document.getElementById("Fade out될 레이어ID").style.opacity = 1 - op;
parent.document.getElementById("Fade out될 레이어ID").style.filter = "alpha(opacity="+(100 - i)+")";
//alert(document.getElementById("Fade out될 레이어ID").style.filter);
if(i > 99){
clearInterval(tid);
parent.document.getElementById("Fade out될 레이어ID").style.display='none';
i = 0;
}
}
function hide(){
tid = setInterval(hideLayer,50);
}
</script>
onclick = "hide();"