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

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

· 19년 전 · 5536 · 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 부분에 적용시키나요? 적용 시키는 부분이 궁금합니다..

게시글 목록

번호 제목
2110
2102
2101
2100
2084
2081
2074
2057
2055
2044
2040
2029
2028
2023
2014
2009
2005
2002
1991
1990