제로나라 님의 메뉴스킨에서

제로나라 님의 메뉴스킨에서

QA

제로나라 님의 메뉴스킨에서

본문

아래 제로나라 님의 메뉴를 사용하고자 하는데요.

http://sir.co.kr/bbs/board.php?bo_table=g5_skin&wr_id=6687

 

메뉴에서 재일 마지막 부분 마우스 오버시, 서브부분이 밖으로 나가는데, 이걸 왼쪽으로 나타나게 할수 없을까요?

아래 이미지처럼요.

 

897b46169364d90c728d987f16458d15_1428635315_9049.png 

아래는 스타일 소스입니다.

<div id="wrapper">
    <nav id="cssmenu">
    <ul>
        <?php
        $sql = " select *
                    from {$g5['menu_table']}
                    where me_use = '1'
                      and length(me_code) = '2'
                    order by me_order, me_id ";
        $result = sql_query($sql, false);
        $gnb_zindex = 999; // gnb_1dli z-index 값 설정용

        for ($i=0; $row=sql_fetch_array($result); $i++) {
        ?>
        <li class="has-sub" style="z-index:<?php echo $gnb_zindex--; ?>">
            <a href="<?php echo $row['me_link']; ?>" target="_<?php echo $row['me_target']; ?>"><span><?php echo $row['me_name'] ?></span></a>
            <?php
            $sql2 = " select *
                        from {$g5['menu_table']}
                        where me_use = '1'
                          and length(me_code) = '4'
                          and substring(me_code, 1, 2) = '{$row['me_code']}'
                        order by me_order, me_id ";
            $result2 = sql_query($sql2);

            for ($k=0; $row2=sql_fetch_array($result2); $k++) {
                if($k == 0)
                    echo '<ul>'.PHP_EOL;
            ?>
                <li><a href="<?php echo $row2['me_link']; ?>" target="_<?php echo $row2['me_target']; ?>"><span><?php echo $row2['me_name'] ?></span></a></li>
            <?php
            }

            if($k > 0)
                echo '</ul>'.PHP_EOL;
            ?>
        </li>
        <?php
        }

        if ($i == 0) {  ?>
            <li>메뉴 준비 중입니다.<?php if ($is_admin) { ?> <br><a href="<?php echo G5_ADMIN_URL; ?>/menu_list.php">관리자모드 > 환경설정 > 메뉴설정</a>에서 설정하실 수 있습니다.<?php } ?></li>
        <?php } ?>
    </ul>
    </nav>
</div> ​

 

스타일 소스

#cssmenu ul,
#cssmenu li,
#cssmenu span,
#cssmenu a {
  margin: 0;
  padding: 0;
  position: relative;
}
#cssmenu {
  background: #3366cc;
  border-bottom: 2px solid #db000b;
  width: auto;
  margin-bottom:10px;
}
#cssmenu:after,
#cssmenu ul:after {
  content: '';
  display: block;
  clear: both;
}
#cssmenu a {
  background: #3366cc;
  color: #ffffff;
  display: block;
  font-family:'MS PGothic', Osaka, Tahoma, '굴림', Gulim, SimSun, Arial, sans-serif;
  text-decoration: none;
}
#cssmenu ul {
  list-style: none;
}
#cssmenu > ul > li {
  display: inline-block;
  float: left;
  margin: 0;
  width:97px;
  height:42px;
  line-height:42px;
  text-align:center;
}
#cssmenu.align-center {
  text-align: center;
}
#cssmenu.align-center > ul > li {
  float: none;
}
#cssmenu.align-center ul ul {
  text-align: left;
}
#cssmenu.align-right > ul {
  float: right;
}
#cssmenu.align-right ul ul {
  text-align: right;
}
#cssmenu > ul > li > a {
  color: #fff;
  font-size: 15px;
  font-weight:bold;
}
#cssmenu > ul > li:hover:after {
  content: '';
  display: block;
  width: 0;
  height: 0;
  position: absolute;
  left: 50%;
  bottom: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid #db000b;
  margin-left: -10px;
}
#cssmenu > ul > li:first-child > a {
}
#cssmenu.align-right > ul > li:first-child > a,
#cssmenu.align-center > ul > li:first-child > a {
}
#cssmenu.align-right > ul > li:last-child > a {
}
#cssmenu > ul > li.active > a,
#cssmenu > ul > li:hover > a {
  color: #fff;
}
#cssmenu .has-sub {
  z-index: 1;
}
#cssmenu .has-sub:hover > ul {
  display: block;
}
#cssmenu .has-sub ul {
  display: none;
  position: absolute;
  width: 180px;
  top: 100%;
  left: 0;
}
#cssmenu.align-right .has-sub ul {
  left: auto;
  right: 0;
}
#cssmenu .has-sub ul li {
  *margin-bottom: -1px;
}
#cssmenu .has-sub ul li a {
  background: #db000b;
  border-bottom: 1px dotted #ff0f1b;
  font-size: 12px;
  filter: none;
  display: block;
  line-height: 120%;
  padding: 10px;
  color: #ffffff;
  text-align:left;
}
#cssmenu .has-sub ul li:hover a {
  background: #a80008;
}
#cssmenu ul ul li:hover > a {
  color: #ffffff;
}
#cssmenu .has-sub .has-sub:hover > ul {
  display: block;
}
#cssmenu .has-sub .has-sub ul {
  display: none;
  position: absolute;
  left: 100%;
  top: 0;
}
#cssmenu.align-right .has-sub .has-sub ul,
#cssmenu.align-right ul ul ul {
  left: auto;
  right: 100%;
}
#cssmenu .has-sub .has-sub ul li a {
  background: #a80008;
  border-bottom: 1px dotted #ff0f1b;
}
#cssmenu .has-sub .has-sub ul li a:hover {
  background: #8f0007;
}
#cssmenu ul ul li.last > a,
#cssmenu ul ul li:last-child > a,
#cssmenu ul ul ul li.last > a,
#cssmenu ul ul ul li:last-child > a,
#cssmenu .has-sub ul li:last-child > a,
#cssmenu .has-sub ul li.last > a {
  border-bottom: 0;
}

이 질문에 댓글 쓰기 :

답변 3

답변을 작성하시기 전에 로그인 해주세요.
전체 0 | RSS
QA 내용 검색
  • 개별 목록 구성 제목 답변작성자조회작성일
  • 질문이 없습니다.

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT