본사이트 우측처럼 페이지를 만들어야 합니다. 채택완료
http://www.skbroadband-biz.com/service/">http://www.skbroadband-biz.com/service/
좋은 방법이 없을까요?
고수님들 만은 답변 주세요
답변 1개
</strong></p>
<ul>
<li><!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript" src="<a href="http://code.jquery.com/jquery-1.9.1.min.js"></script>" target="_blank" rel="noopener noreferrer">http://code.jquery.com/jquery-1.9.1.min.js"></script></a>
<style type="text/css">
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
html, body { margin: 0; padding: 0; height: 100%; overflow-x: hidden; background: #ff9900;}
#sideMenu { position: fixed; top: 0; left: -250px; z-index: 80;height: 100%; width: 250px; padding: 20px;background-color: #ffcc00; color: #000; transition: left 0.6s;}
#sideMenu ul { padding: 0; list-style: none; margin: 0; display: none;}
#menuBtn {position: fixed; top: 10px; left: 10px; z-index: 100;background: #f1103a; font: bold 1.7em/36px Courier New; width: 36px; height: 36px; text-align: center; color: #FFF;text-shadow: 0 -5px, 0 5px; border-radius: 50px; cursor: pointer;transition: left 0.9s;}
#contentBox {position: absolute; top: 0px; left: 0px; z-index: 90; padding: 20px; width: 100%; z-index: 0;background: #ff9900;word-break:break-all;transition: left 0.2s;}
</style>
<script type="text/javascript">
$(function(){
// css transition 으로 애니메이션 효과를 주었으나 ie 저버전에서도 애니메이션 효과를 주려면 jquery의 animate() 사용.
$("#menuBtn").click(function() {
if($("#sideMenu").offset().left == 0){
$("#menuBtn").css("left","10px");
$("#sideMenu").css("left","-250px");
$("#contentBox").css("left","0"); // 주석 처리하면 메뉴만 움직
$("#sideMenu ul").slideUp(100);
}else{
$("#menuBtn").css("left","200px");
$("#sideMenu").css("left","0");
$("#contentBox").css("left","250px"); // 주석 처리하면 메뉴만 움직
$("#sideMenu ul").slideDown(500);
}
});
});
</script>
</head>
<body>
<div id="sideMenu"><ul><li>1111111111111111</li><li>22222222222222222222</li><li>33333333333</li><li>444444444444444</li></ul></div>
<div id="menuBtn">─</div>
<div id="contentBox"><div style="height:50px;background: #00ccff;"></div>dfsd62w4gddjfgjfnbnsddfsd62df</div>
</body>
</html></li>
</ul>
<p><strong>
답변에 대한 댓글 1개
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인
.뭘 바꿔야 되죠? ㅎㅎ