ypSlideOut 슬라이드 스크립트를 이용한 간단한"게시판세로 분류세로" 슬라이드형 자동 메뉴입니다.
대개 왼쪽 네비게이션 위치에 사용하면 좋을 것입니다.

미리보기 링크1 아래 링크된 메뉴입니다.

게시판제목 영역에 마우스를 올리면 분류메뉴가 오른쪽으로 슬라이드 되면서 나타납니다.

롤오버 메뉴로 사용 가능하며 원하는 경우에만 주석을 참고해서 게시판버튼을 만들어 주세요.

게시판 버튼 이미지 폴더가 지정된 위치에 없으면 텍스트 타입메뉴로 동작합니다.

환경설정은 첨부 소스의 주석을 참고하세요.
그대로 올리고 테스트 가능하며 "분류 숫자에 따른 서브레이어의 사이즈"만 수정하시면 됩니다.
가장 많은 분류를 가진 게시판을 기준으로 높이를 설정해서 그냥 사용해도 무방하지만,
완성도있게 활용하자면 소스의 "게시판별 서브메뉴 개별 환경설정" 부분을 참고해서 약간의 추가 작업을 해주시면 되겠습니다.

스킨형 메뉴로 제작하기에 앞서 단독 파일형으로 미리 작업한 것입니다.
rolo님 라이브러리를 참조해서 쿼리를 작성하였습니다.

rolo님께서 분류까지 컨드롤 가능한 라이브러리로 업그레이드 해주시면 그때 좀더 체계적인 스킨 작업을 해볼 예정입니다.

매번 그렇습니다만, 시각적 요소등은 각자 알아서 처리하셔야 합니다.

감사의 말씀 보다는 "버그나 개선사항"을 알려주시면 더욱 감사하겠습니다.

아래는 고수님들의 옆차기를 얻기 위해 핵심 부분만 붙여 넣습니다.
_____________________________________________________~~**

<?
// rolo님 메뉴스킨 라이브러리 참조, 일반적인 조건으로 쿼리
// 제외 게시판 - 전체 검색 사용 no, 목록열람 레벨
// 게시판 정렬 - 전체 검색 오름 차순

//### 게시판 추출 - 메뉴가 위치하는 게시판만
$grN = sql_fetch(" select gr_id, gr_subject from $g4[group_table] where gr_id = '$gur' ");
//$gur그룹 명시 또는 $gr_id로 대체하면 메뉴 위치에 아이디값 적용됨

$list = array();

// 위 에서 설명한 게시판외에 제외시키고자 하는 게시판을 수동으로 추가
$exc = "('게시판1', '게시판2', '게시판3')";

//## 게시판 추출 -목록열람 레벨 적용후 검색순 정렬
$sql = " select bo_table, bo_subject, bo_category_list, bo_new from $g4[board_table] where (bo_list_level <= $member[mb_level]) and (gr_id = '$grN[gr_id]') and bo_table not in {$exc} order by bo_order_search";

$result = sql_query($sql);

for ($i=0; $row = sql_fetch_array($result); $i++) {
    //$list[$row['bo_table']]['bo_table'] = $row['bo_table'];//이 줄은 배열값을 얻은후 다시 주석처리 합니다.
    $list[$row['bo_table']]['bo_subject'] = $row['bo_subject'];
    $list[$row['bo_table']]['sca'] = explode("|", $row['bo_category_list']);
}

// 게시판별 분류메뉴 개별 환경설정시 아래를 반드시 참고해야 합니다.
// 다양한 옵션을 이용하려면 이 개별 환경설정을 사용해야 합니다.
// 1, 위 반복문의 첫줄 주석을 풀어줍니다.
// 2, 아래 세줄의 주석을 풀고 메뉴가 링크된 페이지로 가서 게시판 배열값을 얻는다.
//foreach( $list as $key => $value)
//$caId[] = $value['bo_table']; //분류 구분
//print_r2 ($caId);// 3, 이 줄과 반복문의 주석처리된 줄은 배열값을 얻은후 다시 주석처리 합니다.
?>
<script language="javascript">
//###### 게시판별 분류메뉴 개별 환경설정 시작
//# 일괄 환경설정시 모두 주석처리합니다.
// 4, 위에서 얻은 게시판 배열값을 참고해서 게시판별 분류메뉴의 시작위치,x좌표,y좌표,너비,높이만 설정
//  var <?=$caId[0]?> = new ypSlideOutMenuCa("<?=$caId[0]?>", "right", 0, 1, 122, 105)
//  var <?=$caId[1]?> = new ypSlideOutMenuCa("<?=$caId[1]?>", "up", 0, 1, 122, 147)
//  var <?=$caId[2]?> = new ypSlideOutMenuCa("<?=$caId[2]?>", "down", 0, 1, 122, 308)
//###### 개별 환경설정 끝

//###### 전체게시판 분류메뉴 일괄 환경설정 시작
//# 개별 환경설정시 모두 주석처리합니다.
//# 가장 넓고 높은 게시판을 기준으로 너비와 높이를 설정하면 됩니다.
//# 이경우 보이지 않는 이 영역에 마우스가 올라가 있으면 분류메뉴가 사라지지 않습니다.
//# 매우 귀찮거나 메뉴 크기가 크게 다르지 않을때, 테스트 외에는 권장하지 않는 방법입니다.
<?
foreach( $list as $key => $value) {
//#################################### 분류메뉴의 시작위치,x좌표,y좌표,너비,높이만 설정
    ?>var <?=$key?> = new ypSlideOutMenuCa("<?=$key?>", "right", 120, -25, 122, 150);<?
}
?>
//###### 일괄 환경설정 끝

ypSlideOutMenuCa.writeCSS();
</script><?

//$gBtnpath = "이미지 폴더 경로" ."/". "gBtn";/* 게시판 버튼 이미지 폴더 gBtn */
//$gBtnpath = "$g4[path]" ."/". "gallery/images/menu/bc_ypSlide";/* 게시판 버튼 이미지 폴더 gBtn */
if (is_dir($gBtnpath)) {
?><div style="dispaly:none" onLoad="MM_preloadImages('<? foreach( $list as $key=> $value) { echo"{$gBtnpath}/{$key}_1.gif','{$gBtnpath}/{$key}_2.gif')";}?>"></div><?
}

?><div id='bc_global'>
    <div style='float:left; padding:5 0 0 0;'></div><?

// ## board
$menu_size= count( $list);
foreach( $list as $key=> $value) {

    ?><div id='bc_boardMenu'><?
    if (!is_dir($gBtnpath)) {/* 이미지 폴더가 없다면 텍스트 스타일(기본) */

        $style = "";
        if ($key == $bo_table)//해당 게시판 강조
        $style = "style='font-weight:bold; color:#45436c;'";
        $bo_subject = "<span $style>" . cut_str(get_text($value['bo_subject']),20,"") . "</span>";

    ?><div><a href='<?=$g4[bbs_path]?><?=$key == "sample_gal"?'/gallery/?gur':'/board.php?bo_table=';/*특정게시판 경로*/?><?=$key?>' onmouseover="ypSlideOutMenuCa.showMenu('<?=$key?>')" onmouseout="ypSlideOutMenuCa.hideMenu('<?=$key?>')" class='bc_boardName'><?=$bo_subject?></a></div><?

    }
    else {
        /* 이미지 폴더가 있다면 이미지로 표시(옵션)
        * 기본 이미지 - 게시판아이디_1.gif *
        * 롤오버 이미지 - 게시판아이디_2.gif */
        ?><span style="width:100px;height:25px;border:0px solid gray;text-align:center;vertical-align:middle;cursor:pointer;"><a href='<?=$g4[bbs_path]?><?=$key == "sample_gal"?'/gallery/?gur':'/board.php?bo_table=';/*특정게시판 경로*/?><?=$key?>' onMouseOver="ypSlideOutMenuCa.showMenu('<?=$key?>'), MM_swapImage('<?=$key?>','','<?=$gBtnpath?>/<?=$key?>_2.gif',1)" onMouseOut="ypSlideOutMenuCa.hideMenu('<?=$key?>'), MM_swapImgRestore()" onfocus='this.blur()'><?
        if ($key == $bo_table){//해당 게시판 표시
            ?><img src="<?=$gBtnpath?>/<?=$key?>_2.gif" width="120" height="25" border=0 name="<?=$key?>" alt="<?=$key?>"></a></span><?
        }else{
            ?><img src="<?=$gBtnpath?>/<?=$key?>_1.gif" width="120" height="25" border=0 name="<?=$key?>" alt="<?=$key?>"></a></span><?
        }
    }

    ?><div id='caDiv'>
    <div id="<?=$key?>Container">
    <div id="<?=$key?>Content" class="caLayer"><?

    // # sca         
    foreach( $value['sca'] as $name) {
        //print_r2 ($name);
        if ($name){//분류구분 경계를 위한 꼼수
        $style = "";
        if ($name == $sca)//해당 게시판 강조
        $style = "style='font-weight:normal; color:red;'";
        $ca_subject = "<span $style>" . cut_str(get_text($name),20,"") . "</span>";

        ?><div class='caSubject'><a href='<?=$g4['bbs_path']?>/board.php?bo_table=<?=$bo_table?>&sca=<?=urlencode($name)?>' class='caName'><?=$ca_subject?></a></div><?
        }//name
    }//foreach
    ?></div></div></div>
    </div><?// group end
}//foreach 주메뉴 끝
   
?></div><!-- global end -->