채택완료

메뉴 show/hide 스크립트 수정

2017-12-27 (수) 17:00:05 3,607

아래의 소스에서 [서울]을 클릭하면 하위 메뉴들이 나오는데요

[인천]을 클릭하면 [서울] 하위메뉴는 자동으로 닫기고 [인천]만 열리게 하려면

스크립트를 어떻게 수정하야할까요??

(참고 : 현재, 클릭을 한 번 더 해야 닫기가 됩니다. )

Copy
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<style type="text/css">
#menulink {
 display: none;
}
</style>

<script language="JavaScript">
function showOrHide(zap) {
 if (document.getElementById) {
  var abra = document.getElementById(zap).style;
  if (abra.display == "block") {
   abra.display = "none";
   } else {
   abra.display = "block";
  }
  return false;
  } else {
  return true;
 }
}
</script>

</head>

<body>

  <div class="map">
     <h5><a href="#" onclick="return showOrHide('menulink');">서울</a></h5>

    <h5><a href="#" onclick="return showOrHide('menulink02');">인천</a></h5>
  </div>

 

  <ul id="menulink">
   <li><a href="">O</a></li>
   <li><a href="">S</a></li>        
   <li><a href="">A</a></li>
   <li><a href="">M</a></li>
   <li><a href="">M</a></li>
  </ul>

 

 

  <ul id="menulink02">
   <li><a href="">O</a></li>
   <li><a href="">S</a></li>        
   <li><a href="">A</a></li>
   <li><a href="">M</a></li>
   <li><a href="">M</a></li>
  </ul>

 
</body>
</html>
|

답변 1개

채택된 답변
+20 포인트

function showOrHide(zap) {
document.getElementById("menulink").style.display = "none";
document.getElementById("menulink2").style.display = "none";

함수 바로 아래 저렇게 넣어보세요..

답변을 작성하려면 로그인이 필요합니다.