[JS] 슬라이딩 레이어

<style style="text/css">
.layerMainWrap{
position:absolute;
top:0;left:-627px;
z-index:999;
width:627px;
}
.layerMainWrap .layerBox{
position:relative;
float:right;
}
.layerMainWrap .layerBox .Main_Closebtn{position:absolute;top:2px;right:12px;}
.layerMainWrap .layerBox .iconArrow{position:absolute;top:33px;right:3px;}
#iconArrow{display:none;position:absolute;top:17px;left:-7px;}
.layerMainWrap .layerBox .layerInfo{
position:relative;
margin-right:10px;
border:2px solid #4e4b47;
}
</style>

<script type="text/javascript">
jQuery( document ).ready(function(){
jQuery("#btnLayerMain").live("click", function(){
layMain();
});
jQuery(".Main_Closebtn").live("click", function(){
layMain();
});
var layMainBox = jQuery("#layerMainWrap");
setTimeout(function(){
jQuery("#layerMainWrap").fadeOut("2000");
jQuery("#iconArrow").show();
}, 2000);
});
function layMain(){
var lay= document.getElementById("btnLayerMain");
var layMBox= document.getElementById("layerMainWrap");
jQuery("#layerMainWrap").css("left","0");
if(layMBox.style.display=="none"){
layMBox.style.display="block";
jQuery("#layerMainWrap").animate({opacity: 1, left:"-627px"}, 200 );
jQuery("#iconArrow").hide();
}else if(layMBox.style.display="block"){
layMBox.style.display="none";
jQuery("#layerMainWrap").animate({opacity: 0, left:"0"}, 200 );
jQuery("#iconArrow").show();
}
}
</script>
<div class="first" style="border-bottom:1px solid #ccc;cursor:pointer;">
<a href="#none"><img src="" id="btnLayerMain" alt="" style="margin-top:-1px;" /></a>
<img src="" id="iconArrow" alt="" />
<div class="layerMainWrap" id="layerMainWrap"> 
<div id="layerMainCon">
<div class="layerBox">
<div class="layerInfo">
<img src="" alt="" />
</div>
<a href="#none" class="Main_Closebtn"><img src="" alt="닫기" /></a>
<span class="iconArrow"><img src="" alt="" /></span>
</div>
</div>
</div>
</div>

결국 animate 효과를 넣기 위해서 위처럼 변경이 되었다.
animate 안에 display 를 넣었더니 ie에서 하위 호환이 안되었었다.
내가 오타를 낸거였는지 아니면 안먹는 건지 검색을 해보니 대부분 Opacity 를 이용하거나 .css().animate() 이런식으로 사용하던데...뭐가 맞는거지'';;
jquery.com 을 보면 글꼴, 배경, 테두리는 아직 미지원이라고 되어 있다...
역시 내가 뭘 잘못했던 거겠지...=ㅁ=);