테스트 사이트 - 개발 중인 베타 버전입니다

콤보스타일 메뉴 입니다.

· 9년 전 · 212

<html>
<head>
<style>
    #bannerbox .oherpromotion {display:inline; position:relative; float:left; margin:3px 11px 0 0 ; }
    #bannerbox .oherpromotion h3 {float:left; width:188px; height:20px; background:url(http://imgshopping2.naver.com/2007/new/main/bg_oftenview.gif) no-repeat left top; color:#666; font-weight:normal; font-size:12px; text-align:left; letter-spacing:-1px}
    #bannerbox .oherpromotion h3 a {display:block; width:184px; height:16px; padding:4px 0 0 7px; color:#666; text-decoration:none;}
    #bannerbox .oherpromotionlist {position:absolute; left:0px; top:18px; width:188px; background:url(http://imgshopping2.naver.com/2007/new/main/bg_ranking_list_mid.gif) repeat-y left top; z-index:100;}
    #bannerbox .oherpromotioninner {background:url(http://imgshopping2.naver.com/2007/new/main/bg_ranking_list_bottom.gif) no-repeat left bottom;}
    #bannerbox .oherpromotionlist ul {width:158px; margin:0 8px; padding:3px 0; overflow:hidden;}
    #bannerbox .oherpromotionlist li {width:100%; padding:6px 0 4px 0; background:url(http://imgshopping2.naver.com/2007/new/rankingshop/dot_gray01.gif) repeat-x left top; font-size:12px; vertical-align:top; line-height:1em; letter-spacing:-1px; text-align:left;}
    #bannerbox .oherpromotionlist li a {padding-left:15px; background:url(http://imgshopping2.naver.com/2007/new/rankingshop/bu_arrow02.gif) no-repeat 3px top; color:#7f7f7f;}
    #bannerbox .oherpromotionlist li a:hover {color:#64a32f;}

</style>
<script>
function toggleView(target){
    var sTarget = target.href.split("#");
    var aTarget = document.getElementById(sTarget[sTarget.length-1]);
    if(aTarget.style.display == "none") aTarget.style.display = "block";
    else aTarget.style.display = "none";   
}
</script>
</head>
<body>
<div id="bannerbox">
    <div class="oherpromotion">
    <h3><a href="#oherpromotionview" onClick="toggleView(this); return false;" onfocus=this.blur()>네이버 콤보스타일 메뉴</a></h3>
        <div id="oherpromotionview" class="oherpromotionlist" style="display:none;">
            <div class="oherpromotioninner">
                <ul>
                    <li><A HREF="http://www.naver.com">네이버 1</A>
                    <li><A HREF="http://www.naver.com">네이버 2</A>
                    <li><A HREF="http://www.naver.com">네이버 3</A>                   
                </ul>
            </div>
        </div>
    </div>
</div>
</body>
</html> 

댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

게시글 목록

번호 제목
384
12508
383
381
20395
12507
12506
12505
12504
12503
12502
12500
12499
12498
20392
12497
12496
12495
12494
12493
12492
12491
12490
12489
12488