<html>
<head>
<title>http://www.naver.com</title>
<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>
자료출저 : www.naver.com
======================
스타일의 이미지가 링크방식이라..붙이셔 바로 사용하실 수 있으실겁니다.
<head>
<title>http://www.naver.com</title>
<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>
자료출저 : www.naver.com
======================
스타일의 이미지가 링크방식이라..붙이셔 바로 사용하실 수 있으실겁니다.
[이 게시물은 관리자님에 의해 2011-10-31 17:16:08 PHP & HTML에서 이동 됨]
댓글 2개
17년 전
익스만 잘 보이는다는 글이 돌아다니네요 ㅡㅡ;;;;;
17년 전
코드상으로는 표준인데... 익스만 보이나요?
게시판 목록
프로그램
| 번호 | 제목 | 글쓴이 | 날짜 | 조회 |
|---|---|---|---|---|
| 2130 | 17년 전 | 1172 | ||
| 2129 |
ⓧ힘내세요
|
17년 전 | 2230 | |
| 2128 | 17년 전 | 2872 | ||
| 2127 | 17년 전 | 4055 | ||
| 2126 | 17년 전 | 3142 | ||
| 2125 | 17년 전 | 1404 | ||
| 2124 | 17년 전 | 1707 | ||
| 2123 | 17년 전 | 2235 | ||
| 2122 | 17년 전 | 1542 | ||
| 2121 | 17년 전 | 1719 | ||
| 2120 | 17년 전 | 2712 | ||
| 2119 | 17년 전 | 2141 | ||
| 2118 | 17년 전 | 1794 | ||
| 2117 |
아름다운세상
|
17년 전 | 4195 | |
| 2116 | 17년 전 | 3046 | ||
| 2115 | 17년 전 | 1435 | ||
| 2114 |
아름다운세상
|
17년 전 | 3566 | |
| 2113 | 17년 전 | 2793 | ||
| 2112 | 17년 전 | 2072 | ||
| 2111 | 17년 전 | 1288 | ||
| 2110 | 17년 전 | 2327 | ||
| 2109 | 17년 전 | 2063 | ||
| 2108 | 17년 전 | 1982 | ||
| 2107 |
휴전합시다
|
17년 전 | 1918 | |
| 2106 | 17년 전 | 1168 | ||
| 2105 |
|
17년 전 | 1871 | |
| 2104 | 17년 전 | 2925 | ||
| 2103 | 17년 전 | 1426 | ||
| 2102 | 17년 전 | 1668 | ||
| 2101 | 17년 전 | 1353 | ||
| 2100 | 17년 전 | 1598 | ||
| 2099 | 17년 전 | 1572 | ||
| 2098 | 17년 전 | 1443 | ||
| 2097 | 17년 전 | 2555 | ||
| 2096 | 17년 전 | 2321 | ||
| 2095 | 17년 전 | 2107 | ||
| 2094 | 17년 전 | 1417 | ||
| 2093 | 17년 전 | 2427 | ||
| 2092 | 17년 전 | 4255 | ||
| 2091 | 17년 전 | 2740 | ||
| 2090 | 17년 전 | 1658 | ||
| 2089 | 17년 전 | 1849 | ||
| 2088 | 17년 전 | 3225 | ||
| 2087 | 17년 전 | 2226 | ||
| 2086 | 17년 전 | 3820 | ||
| 2085 | 17년 전 | 1671 | ||
| 2084 | 17년 전 | 2267 | ||
| 2083 | 17년 전 | 2095 | ||
| 2082 | 17년 전 | 1610 | ||
| 2081 | 17년 전 | 2125 | ||
| 2080 |
letsgolee
|
17년 전 | 1921 | |
| 2079 | 17년 전 | 1957 | ||
| 2078 | 17년 전 | 3069 | ||
| 2077 | 17년 전 | 2143 | ||
| 2076 | 17년 전 | 1435 | ||
| 2075 | 17년 전 | 1455 | ||
| 2074 | 17년 전 | 2125 | ||
| 2073 | 17년 전 | 3205 | ||
| 2072 | 17년 전 | 2136 | ||
| 2071 |
휴전합시다
|
17년 전 | 1530 | |
| 2070 | 17년 전 | 4237 | ||
| 2069 | 17년 전 | 2031 | ||
| 2068 | 17년 전 | 3458 | ||
| 2067 | 17년 전 | 6030 | ||
| 2066 | 17년 전 | 1483 | ||
| 2065 |
letsgolee
|
17년 전 | 1652 | |
| 2064 | 17년 전 | 1235 | ||
| 2063 | 17년 전 | 1347 | ||
| 2062 |
vicky
|
17년 전 | 2872 | |
| 2061 | 17년 전 | 1908 | ||
| 2060 |
카프카07
|
17년 전 | 2594 | |
| 2059 | 17년 전 | 1302 | ||
| 2058 | 17년 전 | 3184 | ||
| 2057 | 17년 전 | 2161 | ||
| 2056 | 17년 전 | 2606 | ||
| 2055 | 17년 전 | 1405 | ||
| 2054 | 17년 전 | 1751 | ||
| 2053 | 17년 전 | 1145 | ||
| 2052 |
|
17년 전 | 1202 | |
| 2051 | 17년 전 | 1785 | ||
| 2050 | 17년 전 | 1227 | ||
| 2049 | 17년 전 | 4309 | ||
| 2048 | 17년 전 | 1504 | ||
| 2047 | 17년 전 | 2002 | ||
| 2046 |
카프카07
|
17년 전 | 7088 | |
| 2045 | 17년 전 | 1382 | ||
| 2044 | 17년 전 | 1894 | ||
| 2043 | 17년 전 | 3132 | ||
| 2042 | 17년 전 | 1220 | ||
| 2041 |
카프카07
|
17년 전 | 1982 | |
| 2040 | 17년 전 | 1152 | ||
| 2039 |
smilesol
|
17년 전 | 1847 | |
| 2038 | 17년 전 | 2152 | ||
| 2037 |
|
17년 전 | 2965 | |
| 2036 | 17년 전 | 1244 | ||
| 2035 |
|
17년 전 | 1333 | |
| 2034 |
ㅣ곰탱이ㅣ
|
17년 전 | 1560 | |
| 2033 |
|
17년 전 | 1231 | |
| 2032 | 17년 전 | 4352 | ||
| 2031 | 17년 전 | 3895 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기