동글이

메뉴에서 선택된 목록을 bold처리하는 방법

· 13년 전 · 1532
메뉴에서 선택된 목록을 bold처리하는 방법을 알고 싶습니다.
CSS는 수정을 해도 변화가 없더라구요. 다른 명령어가 필요한 것인가요?
css, php, js파일 첨부합니다. 그리고 파일 내용은 아래와 같습니다.
질문 게시판에 비슷한 경우 답변이 있어 적용을 해봤는데, 동작을 하지 않네요.

[ CSS 내용 ]
/* ================================================================
This copyright notice must be kept untouched in the stylesheet at
all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.stunicholls.com/menu/pro_drop_1.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any
way to fit your requirements.
=================================================================== */

.preload1 {background: url(blank_over.gif);}
.preload2 {background: url(blank_overa.gif);}

#nav {padding:0; margin:0; list-style:none; height:36px; background:#fff; position:relative; z-index:9999; font-family:arial, verdana, sans-serif;}
#nav li.top {display:block; float:left;}

#nav li a.top_link:link,
#nav li a.top_link:visited {display:block; float:left; height:36px; line-height:27px; color:#ccc; text-decoration:none; font-size:11px; font-weight:bold; padding:0 0 0 12px; cursor:pointer;background: url(blank.gif);}
#nav li a.top_link:hover {color:#000; background: url(blank_over.gif) no-repeat;}

#nav li a.top_link span {float:left; display:block; padding:0 24px 0 12px; height:36px;background:url(blank.gif) right top;}
#nav li a.top_link span.down {float:left; display:block; padding:0 24px 0 12px; height:36px; background:url(blanka.gif) no-repeat right top;}

#nav li a.top_link:hover span {background:url(blank_over.gif) no-repeat right top;}
#nav li a.top_link:hover span.down {background:url(blank_overa.gif) no-repeat right top;}

#nav li:hover > a.top_link {color:#000; background: url(blank_over.gif) no-repeat;}
#nav li:hover > a.top_link span {background:url(blank_over.gif) no-repeat right top;}
#nav li:hover > a.top_link span.down {background:url(blank_overa.gif) no-repeat right top;}

/* Default list styling */

#nav li:hover {position:relative; z-index:200;}

/* keep the 'next' level invisible by placing it off screen. */
#nav ul,
#nav li:hover ul ul,
#nav li:hover ul li:hover ul ul,
#nav li:hover ul li:hover ul li:hover ul ul,
#nav li:hover ul li:hover ul li:hover ul li:hover ul ul
{position:absolute; left:-9999px; top:-9999px; width:0; height:0; margin:0; padding:0; list-style:none;}

#nav li:hover ul.sub
{left:0; top:31px; background: #fff; padding:3px; border:1px solid #3a93d2; white-space:nowrap; width:90px; height:auto; z-index:300;}
#nav li:hover ul.sub li
{display:block; height:20px; position:relative; float:left; width:90px; font-weight:normal;}
#nav li:hover ul.sub li a
{display:block; font-size:11px; height:20px; width:90px; line-height:20px; text-indent:5px; color:#000; text-decoration:none;}
#nav li ul.sub li a.fly
{background:#fff url(arrow.gif) 80px 7px no-repeat;}
#nav li:hover ul.sub li a:hover
{background:#3a93d2; color:#fff;}
#nav li:hover ul.sub li a.fly:hover
{background:#3a93d2 url(arrow_over.gif) 80px 7px no-repeat; color:#fff;}

#nav li:hover ul li:hover > a.fly {background:#3a93d2 url(arrow_over.gif) 80px 7px no-repeat; color:#fff;}

#nav li:hover ul li:hover ul,
#nav li:hover ul li:hover ul li:hover ul,
#nav li:hover ul li:hover ul li:hover ul li:hover ul,
#nav li:hover ul li:hover ul li:hover ul li:hover ul li:hover ul
{left:90px; top:-4px; background: #fff; padding:3px; border:1px solid #3a93d2; white-space:nowrap; width:90px; z-index:400; height:auto;}


[ JS 내용 ]
/* ================================================================
This copyright notice must be kept untouched in the stylesheet at
all times.

The original version of this script and the associated (x)html
is available at http://www.stunicholls.com/menu/pro_drop_1.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This script and the associated (x)html may be modified in any
way to fit your requirements.
=================================================================== */
stuHover = function() {
var cssRule;
var newSelector;
for (var i = 0; i < document.styleSheets.length; i++)
for (var x = 0; x < document.styleSheets[i].rules.length ; x++)
{
cssRule = document.styleSheets[i].rules[x];
if (cssRule.selectorText.indexOf("LI:hover") != -1)
{
newSelector = cssRule.selectorText.replace(/LI:hover/gi, "LI.iehover");
document.styleSheets[i].addRule(newSelector , cssRule.style.cssText);
}
}
var getElm = document.getElementById("nav").getElementsByTagName("LI");
for (var i=0; i<getElm.length; i++) {
getElm[i].onmouseover=function() {
this.className+=" iehover";
}
getElm[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(" iehover\\b"), "");
}
}
}
if (window.attachEvent) window.attachEvent("onload", stuHover);


[ PHP 내용 ]
<?
include_once("./_common.php");
?>

<link rel="stylesheet" type="text/css" href="<?=$g4[path]?>/glex/menu/TopMenu/pro_drop_1.css" />
<script type="text/javascript" src="<?=$g4[path]?>/glex/menu/TopMenu/stuHover.js"></script>

<ul id="nav">
<li class="top"><a href="#nogo1" class="top_link"><span>홈</span></a></li>
<li class="top"><a href="<?=$g4[bbs_path]?>/board.php?bo_table=1_1_1&wr_id=1" id="products" class="top_link"><span class="down">소개</span></a>
<ul class="sub">
<li><a href="<?=$g4[bbs_path]?>/board.php?bo_table=1_1_1&wr_id=1">인사말</a></li>
<li><a href="#nogo7">Lenses</a></li>
<li><a href="#nogo19">Flash Guns</a></li>
<li><a href="#nogo20">Tripods</a></li>
<li><a href="#nogo21">Filters</a></li>
</ul>
</li>
<li class="top"><a href="#nogo22" id="services" class="top_link"><span class="down">Services</span></a>
<ul class="sub">
<li><a href="#nogo23">Printing</a></li>
<li><a href="#nogo24">Photo Framing</a></li>
<li><a href="#nogo25">Retouching</a></li>
<li><a href="#nogo26">Archiving</a></li>
</ul>
</li>
<li class="top"><a href="#nogo27" id="contacts" class="top_link"><span class="down">Contacts</span></a>
<ul class="sub">
<li><a href="#nogo28">Support</a></li>
<li><a href="#nogo29">Sales</a></li>
<li><a href="#nogo49">Buying</a></li>
<li><a href="#nogo50">Photographers</a></li>
<li><a href="#nogo51">Stockist</a></li>
<li><a href="#nogo52">General</a></li>
</ul>
</li>
<li class="top"><a href="#nogo53" id="shop" class="top_link"><span class="down">Shop</span></a>
<ul class="sub">
<li><a href="#nogo54">Online</a></li>
<li><a href="#nogo55">Catalogue</a></li>
<li><a href="#nogo56">Mail Order</a></li>
</ul>
</li>
<li class="top"><a href="#nogo57" id="privacy" class="top_link"><span>Privacy Policy</span></a></li>
</ul>

첨부파일

stuHover.js (1.3 KB) 3회 2012-01-28 15:55
top_menu.php (1.8 KB) 3회 2012-01-28 15:55
pro_drop_1.css (3.3 KB) 1회 2012-01-28 15:55
|
댓글을 작성하시려면 로그인이 필요합니다. 로그인

그누4 질문답변

그누보드4 관련 질문은 QA 로 이전됩니다. QA 그누보드4 바로가기 기존 게시물은 열람만 가능합니다.

+
제목 글쓴이 날짜 조회
13년 전 조회 950
13년 전 조회 1,857
13년 전 조회 1,418
13년 전 조회 1,588
13년 전 조회 851
13년 전 조회 983
13년 전 조회 1,708
13년 전 조회 951
13년 전 조회 2,279
13년 전 조회 1,533
13년 전 조회 1,375
13년 전 조회 958
13년 전 조회 1,511
13년 전 조회 2,337
13년 전 조회 934
13년 전 조회 836
13년 전 조회 934
13년 전 조회 1,567
13년 전 조회 959
13년 전 조회 1,575
🐛 버그신고