롤오버변경으로 참조하셔서 수정하여 사용하시면 됩니다.
카멜레온 플러그인에 맞게끔 수정한거라...
약간의 수정이 필요합니다.
꼭 필요하신분 수정해서 사용하세요!

<?
if (!defined("_GNUBOARD_")) exit; // 개별 페이지 접근 불가
?>

<script language="JavaScript">
var save_layer = null;
function layer_view(link_id, menu_id, opt, x, y)
{
    var link = document.getElementById(link_id);
    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 (link_id == '')
        return;

    if (opt == 'hide')
    {
        menu.style.display = 'none';
        selectBoxVisible();
    }
    else
    {
        x = parseInt(x);
        y = parseInt(y);
        menu.style.left = get_left_pos(link) + x;
        menu.style.top  = get_top_pos(link) + link.offsetHeight + y;
        menu.style.display = 'block';
    }

    save_layer = menu;
}

function rollover(link_id, id)
{
    document.images[link_id].src = '<?="$cm_cfg[path]/data/chameleon/menu/$gr_dir"?>'+id+'_over';
} 

function rolloff(link_id, id, on_off)
{
    document.images[link_id].src = '<?="$cm_cfg[path]/data/chameleon/menu/$gr_dir"?>'+id+on_off;
}
function preload() {
  if (!document.images) return;
  var ar = new Array();
  var arguments = preload.arguments;
  for (var i = 0; i < arguments.length; i++) {
    ar[i] = new Image();
    ar[i].src = arguments[i];
  }
  //alert(arguments.length);
}

document.onload = preload('<?=$cm_cfg[path]?>/img/bg_arrow.gif', '<?=$cm_cfg[path]?>/img/menu_arrow.gif', '<?=$cm_cfg[path]?>/img/bg_submenu.gif', '<?=$cm_cfg[path]?>/img/menu_line.gif');
</script>

<script language="javascript" src="<?=$cm_cfg[path]?>/js/sideview.js"></script>

<style>
.bg_menu1 { height:22px;
            border-left-width:1px; border-left-style:solid; border-left-color:#9DADE5;
            border-right-width:1px; border-right-style:solid; border-right-color:#9DADE5;
            padding-left:15px;
            padding-right:15px;
            background-color:#F6FAFF; }
.bg_line1 { height:1px; background-color:#9DADE5; }

.bg_title { background-image:url('<?=$cm_cfg[path]?>/img/lm_category.gif');
            width:179px;
            height:48px;
            padding-left:25px;
            padding-top:4px; }
.bg_menu2 { height:22px;
            padding-left:25px; }
.bg_line2 { background-image:url('<?=$cm_cfg[path]?>/img/dot.gif'); height:3px; }
</style>
<?
function disp_top_menu($i, $x=0, $y=2)
{
    global $menu, $menu1, $cm_cfg, $topmenus;

    $mu_id = $topmenus[$i][mu_id];
    $id    = $topmenus[$i][id];

    if ($cm_cfg[menu]==$mu_id)  {
        $on_off    = "_on";
        $on_off_img = $topmenus[$i][button_on];
    } else {
        $on_off    = "_off";
        $on_off_img = $topmenus[$i][button_off];
    }


    if ($topmenus[$i][button_over]) {
        $over = "rollover('id_{$mu_id}', '$id');";
        $off  = " onmouseout=\"rolloff('id_{$mu_id}', '$id', '$on_off');\"";
    }

    return "{$topmenus[$i][url]}<img src='$on_off_img' border=0 name='id_{$mu_id}' $off onmouseover=\"layer_view('id_{$mu_id}', 'menu_{$mu_id}', 'view', {$x}, {$y});$over\"></a>";
}

function top_box($content)
{
    global $cm_cfg;

    return "
    <table width=100% cellpadding=0 cellspacing=0>
    <tr>
    <td background='$cm_cfg[path]/img/top_box_tl.gif' width=5 height=5></td>
    <td background='$cm_cfg[path]/img/top_box_tc.gif' width='' height=5></td>
    <td background='$cm_cfg[path]/img/top_box_tr.gif' width=5 height=5></td>
    </tr>
    <tr>
    <td background='$cm_cfg[path]/img/top_box_l.gif' width=5></td>
    <td style='padding:10px; line-height:150%;'>$content</td>
    <td background='$cm_cfg[path]/img/top_box_r.gif' width=5></td>
    </tr>
    <tr>
    <td background='$cm_cfg[path]/img/top_box_bl.gif' width=5 height=5></td>
    <td background='$cm_cfg[path]/img/top_box_bc.gif' width='' height=5></td>
    <td background='$cm_cfg[path]/img/top_box_br.gif' width=5 height=5></td>
    </tr>
    </table>";
}

function print_menu1($key, $no)
{
    global $menu;

    $str = "<table id='menu_{$key}' cellpadding=0 cellspacing=0 style='position:absolute; display:none;' onpropertychange=\"selectBoxHidden('menu_{$key}')\">";
    $str .= "<tr><td class=bg_line1></td></tr>";
    $str .= print_menu2($key, $no);
    $str .= "<tr><td class=bg_line1></td></tr>";
    $str .= "</table>\n";

    return $str;
}

function print_menu2($key, $no)
{
    global $menu;
   
    for($i=0; $i<count($menu[$key]); $i++)
    {
        if ($menu[$key][$i][0]=="줄분리")
            $str .= "<tr><td class=bg_line{$no}></td></tr>";
        else
        {
            $target = "";
            if ($menu[$key][$i][2])
                $target = " target=_blank ";
            $span1 = $span2 = "";
            if ($menu[$key][$i][3])
            {
                $span1 = "<span style='{$menu[$key][$i][3]}'>";
                $span2 = "</span>";
            }
            $str .= "<tr><td class=bg_menu{$no}>{$menu[$key][$i][0]}{$span1}{$menu[$key][$i][1]}{$span2}</a></td></tr>";
        }
    }

    return $str;
}

unset($menu);

for ($m=0; $m<count($topmenus); $m++) {
    for($s=0;$s<count($submenus["$m"]);$s++) {
        $menu["{$topmenus[$m][mu_id]}"]["$s"] = array("{$submenus["$m"]["$s"][url]}", "{$submenus["$m"]["$s"][subject]}", 0,"color:#330000");
    }
}

?>

//#############메뉴 출력 부분입니다.

<table cellpadding="0" cellspacing="0" border="0">
<form name=main_menu>
<tr>
    <td align=left>
    <? for ($i=0; $i<count($topmenus); $i++) { ?>

    <?=disp_top_menu($i)?>
    <?=print_menu1($topmenus[$i][mu_id], 1);?>
    &nbsp;&nbsp;
    <? } ?>
    </td>
</tr>
</form>
</table>

p.s:

$topmenus[0][url]        메뉴주소 (<a href='bbs/board.php?bo_table=free'>)
$topmenus[0][mu_id]  메뉴값    (0:홈, 1:커뮤니티, 2:자료실...  )
$topmenus[$i][button_off] 메뉴 오프 이미지값 (<img src='img/main1_off.jpg'>)
$topmenus[$i][button_on] 메뉴 온 이미지값
$topmenus[$i][button_over]  메뉴 마우스 오버시 

적용사이트는 링크 #1입니다.