테스트 사이트 - 개발 중인 베타 버전입니다

sir 주메방식의 메뉴버튼 롤오버

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

<?
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입니다.

댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

댓글 2개

좋은메뉴 감사합니다.
head 부분에 적용시키나요? 적용 시키는 부분이 궁금합니다..

게시글 목록

번호 제목
1795
1789
1785
1784
1783
1774
1758
1743
1730
1727
1718
1709
1691
1690
1679
1673
1660
1645
1636
1633