N빌더 상단메뉴 질문입니다. > 그누4 질문답변

그누4 질문답변

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

N빌더 상단메뉴 질문입니다. 정보

N빌더 상단메뉴 질문입니다.

본문

http://www.rootst.co.kr/

위 사이트는 N빌더를 이용해서 만들고 있는데..

메뉴를 구성하고 메뉴를 클릭하다가 이상한 점을 발견해서 여태 잠못 이루고 소스쪽을 아무리 찾아도... 못찾겠네요 ㅠ.ㅠ 역시나...

문제가 모냐면... 상단 메뉴에서 마우스를 다른 1차 메뉴에서 다른 1차 메뉴로 이동할때...

회사소개에서 제품소개 혹은 솔루션안내에서 제품소개로 이동할때 움찔 움찔하네요...

영어로 된 2차메뉴가 문제인가해서 한글로 변경을 해봤고.. 띠어쓰기가 문제가 되나 해서 다 붙여서 해보기도 했는데.. 역시나 ㅠ.ㅠ 문제군요..

원인 파악이 안되니 초보인 저로써는 해결을 못하겠네요 ㅠ.ㅠ

도움을 주십시요 ㅠㅠ.

소스 첨부 합니다.
<?
if (!defined("_GNUBOARD_")) exit; // 개별 페이지 접근 불가
// 레이어 메뉴와 관련해서 그누보드 sideview.js 파일이 필요한 경우 연결합니다.
if (!function_exists("selectBoxHidden(layer_id)")) {
 echo "<script type='text/javascript' src='$g4[path]/js/sideview.js'></script>";
}
?>
<script type="text/javascript">
var save_layer = null;
function layer_view(menu_id, opt) {
 var menu = document.getElementById(menu_id);
 
 //for (i in link) { document.write(i + '<br/>'); } return;
 if (save_layer != null) {
  save_layer.style.display = "none";
  selectBoxVisible();
 }
 if (opt == 'hide') {
  menu.style.display = 'none';
  selectBoxVisible();
 } else {
  menu.style.display = 'block';
 }
 save_layer = menu;
}
</script>

<style type="text/css">
/*************************************************
여기서부터 시각적인 부분에 대한 수정을 해봅니다.
아래 소스에서 float, width 처럼 파란색으로 보여지는 속성을 키워드로
CSS 도움말 파일(팁&강좌에 있음)에서 검색해보면서 해당속성에 대한 옵션을 익힙니다.
**************************************************/
.zgroup ul { /*서브메뉴 최상위*/
 margin:0;
 list-style-type:none;
}
.sub_menu {
 display:none;
}
.sub_subject {
 width:auto;
 height:auto;
 padding:0 0 0 0;
 border-bottom:1px dotted;
 border-bottom-color:#DDDDDD;
}
</style>

<table width="100%" border="0" cellspacing="0" cellpadding="0">
 <tr>
  <td width="10" height="40" background="<?=$sitemap_skin_path?>/img/menubar_left_blue.gif"></td>
  <td height="40" valign="middle" background="<?=$sitemap_skin_path?>/img/menubar_bg_blue.gif" style="padding-top:5px;">
  
  <table border="0" cellspacing="0" cellpadding="0">
   <tr>
    <?
     // 보드 구룹 만큼 루프를 돌린다. ( $i 는 보드구룹 넘버링 )
     for($i=0; $i<$menu['count']; $i++){
     if ($menu['id'][$i] == 'club') continue;
    ?>
    <td>
    <?
     $font_color[$i] = "#ffffff";
     if($gr_id == $menu['id'][$i]){
      $bg_1[$i] = "<img src='$sitemap_skin_path/img/bar_l.gif'>";
      $bg_2[$i] = "background='$sitemap_skin_path/img/bar_bg.gif'";
      $bg_3[$i] = "<img src='$sitemap_skin_path/img/bar_r.gif'>";
      $font_color[$i] = "#FFFFFF";
      $font_b[$i] = "<b>";
     }
    ?>
    
    <table width="100%" border="0" cellspacing="0" cellpadding="0">
     <tr>
      <td style="width:9px;height:23px;"><?=$bg_1[$i]?></td>
      <td <?=$bg_2[$i]?> style="padding-left:3px;padding-right:3px;">
      <? if ($g4_group[$i][gr_10]) { ?>
      <a href="<?=$g4[bbs_path]?>/board.php?bo_table=<?=$g4_group[$i][gr_10]?>"
      <? } else { ?>
      <a href="<?=$g4[bbs_path]?>/group.php?gr_id=<?=$menu['id'][$i]?>"
      <? } ?>
      onmouseover="layer_view('menu_<?=$menu['id'][$i]?>', 'view', -30, -20);" style="color:#FFFFFF;"><font color=<?=$font_color[$i]?>><b><?=$menu['subject'][$i]?></b></font></a></td>
      <td style="width:9px;height:23px;"><?=$bg_3[$i]?></td>
     </tr>
    </table>
    
    </td>
    <? if ($i+1 < $menu['count']) { ?><td width="5" align="center"><img src="<?=$sitemap_skin_path?>/img/main_line.gif"></td><? } ?>
    <?
     }
    ?>
   </tr>
  </table>
  
  </td>
  <td width="10" height="40" background="<?=$sitemap_skin_path?>/img/menubar_right_blue.gif"></td>
 </tr>
 <tr>
  <td width="10" height="34" background="<?=$sitemap_skin_path?>/img/menubar_sub_left.gif"></td>
  <td height="34" valign="middle" background="<?=$sitemap_skin_path?>/img/menubar_sub_bg.gif">
  <?
   // 보드 구룹 만큼 루프를 돌린다. ( $i 는 보드구룹 넘버링 )
   for($i=0; $i<$menu['count']; $i++){
  ?>
   <div id='menu_<?=$g4_group[$i][gr_id]?>' class='sub_menu'>
   <table border="0" cellspacing="0" cellpadding="0">
    <tr>
     <td width="<?=$g4_group[$i][gr_2]?>"></td>
     <?
      // $gr_bo_c[$i] 는 각 보드 구룹에 속해 있는 보드의 개수 ( $j 는 보드구룹의 보드넘버링)
      for($j=0; $j<$sub['count'][$i]; $j++){

       if($j != $sub['count'][$i]-1){
        $class = "sub_subject";
       } else {
        $class = "sub_last_subject";
       }

       if($sub['table'][$i][$j] == $bo_table){
        $icon = "<span style='color:#000000;font-weight:bold;'>";
       } else {
        $icon = "";
       }
     ?>
     <td style="padding-left:6px;padding-right:6px;">
     <a href="<?=$g4[bbs_path]?>/board.php?bo_table=<?=$sub['table'][$i][$j]?>" class="small">
     <?=$icon?><?=$sub['subject'][$i][$j]?></a></span></td>
     <? if ($j+1 < $sub['count'][$i]) { ?><td width="8" align="center"><img src="<?=$sitemap_skin_path?>/img/sub_line.gif"></td><? } ?>
     <?
      if($gr_id == $menu['id'][$i]){
       echo "<script type=\"text/javascript\">";
       echo "layer_view('menu_{$gr_id}', 'view', -30, -20);";
       echo "</script>";
      }
     }
     ?>
    </tr>
   </table>
   </div>
  <?
   }
  ?>
  </td>
  <td width="10" height="34" background="<?=$sitemap_skin_path?>/img/menubar_sub_right.gif"></td>
 </tr>
</table>

  • 복사

댓글 전체

소스를 봐야 어느정도 원인이  파악이 될 것 같은데, FF에서는 정상으로 보이고 IE에서 메뉴크기가 1~2px 크기로 늘었다 줄었다 하는군요.

서브 메뉴 소스를 한번 자세히 들여다 보세요.
혹시 하단에 소메뉴라고 하나요? 이부분을 출력 할때 왼쪽 으로의 여백 크기를 다시 설정해보세요 ...
<td width="80"></td>  이런부분요 ,,,,밀려서 그런거일수도 ,,
© SIRSOFT
현재 페이지 제일 처음으로