본문 바로가기

codeStorage/javascript

투명 DIV 만들기

-투명DIV 레이아웃 만들기

<s-ript language="javas-ript">
function setOpacity(obj, opacity)
{
var f_opacity = (opacity <= 0)? 0 : opacity/100;

if(typeof obj.style.MozOpacity == "string") // firefox
{
obj.style.MozOpacity = f_opacity;
}
else if(typeof obj.style.KhtmlOpacity == "string") // safari
{
obj.style.KhtmlOpacity = f_opacity;
}
else if(typeof obj.style.filter == "string") // ie
{
obj.style.filter = "Alpha(opacity="+parseInt(100*f_opacity)+")";
}
else // other
{
obj.style.opacity = f_opacity;
}
}
</script>
<div id="kis" style="width:42px; height:25px; position:absolute; left: 50px; top: 87px; z-index:1; background-color:red; cellspacing:0px; cellpadding:0px; border:0px solid #999999;"> TEST</div>

<s-ript language="javas-ript">setOpacity(document.getElementById('kis'), 50)</script>

 

-> 스타일 부분에 Alpha(opacity="+parseInt(100*f_opacity)+")  이 부분만 추가해서

간단하게 해도 상관없지만.

익스플로러가 아닌 브라우저에서는 반투명이 적용안되서

스크립트로 처리하는 부분입니다.