슬라이드 메뉴에 대해서 정보
슬라이드 메뉴에 대해서본문
음~~ 어쩔 수 없이 이미 올라온 소스들을 그대로 올려야 하겠는데 욕하지는 않으시겠지요?
저로서는 며칠을 고민ㅤㅎㅏㄷ가 올리는 것이 너른 양해를 구합니다.
뭔고 허면, 자동메뉴로 올려주신 소스를 가지고 메뉴를 올리려고 하니 게시판은 잘 나오는데 그룹은 안나오는군요.
그룹은 ../group.php?gr_id=그룹아이디 이렇게 해서 불려지는 것으로 알고 있는데 제가 받은 소스는 ../?gur=그룹 아이디 로 불러오는군요. 결국 원하는 그룹의 게시판만이 아니라 모든 게시판을 불러오고 있습니다.
어디를 고쳐야 할지 몰라서 슬라이드 메뉴 전체소스를 올립니다.
=========================================
<? if (!defined("_GNUBOARD_")) exit;// gb_ypSlideRF.php - multi Style
##################################################################
# 라이브러리 - http://sir.co.kr/bbs/tb.php/g4_tiptech/5673 rolo님 라이센스(GNU General Public License)
# 라이브러리 및 스크립트의 라이센스 정책에 일치하는 경우에만 사용하십시오.
# ypSlideOutMenus.js 카피라이트와 gb_ypSlideRF.php 상단 주석 삭제금지
##################### by floc http://www.opensource.org/licenses/afl-2.0.php
*
* Revised:
* - 08/29/2002 : added .hideAll()
* - 04/15/2004 : added .writeCSS() to support more
* than 30 menus.
*
* --youngpup--
*****************************************************/
ypSlideOutMenu.Registry = []
ypSlideOutMenu.aniLen = 500//슬라이딩 속도 250
ypSlideOutMenu.hideDelay = 500//숨김 지연시간 1000
ypSlideOutMenu.minCPUResolution = 10//응답 감도 10
// constructor
function ypSlideOutMenu(id, dir, left, top, width, height)
{
this.ie = document.all ? 1 : 0
this.ns4 = document.layers ? 1 : 0
this.dom = document.getElementById ? 1 : 0
this.css = "";
if (this.ie || this.ns4 || this.dom) {
this.id = id
this.dir = dir
this.orientation = dir == "left" || dir == "right" ? "h" : "v"
this.dirType = dir == "right" || dir == "down" ? "-" : "+"
this.dim = this.orientation == "h" ? width : height
this.hideTimer = false
this.aniTimer = false
this.open = false
this.over = false
this.startTime = 0
// global reference to this object
this.gRef = "ypSlideOutMenu_"+id
eval(this.gRef+"=this")
// add this menu object to an internal list of all menus
ypSlideOutMenu.Registry[id] = this
var d = document
var strCSS = "";
strCSS += '#' + this.id + 'Container { visibility:hidden; '
strCSS += 'left:' + left + 'px; '
strCSS += 'top:' + top + 'px; '
strCSS += 'overflow:hidden; z-index:10000; }'
strCSS += '#' + this.id + 'Container, #' + this.id + 'Content { position:absolute; '
strCSS += 'width:' + width + 'px; '
strCSS += 'height:' + height + 'px; '
strCSS += 'clip:rect(0 ' + width + ' ' + height + ' 0); '
strCSS += '}'
this.css = strCSS;
this.load()
}
}
ypSlideOutMenu.writeCSS = function() {
document.writeln('<style type="text/css">');
for (var id in ypSlideOutMenu.Registry) {
document.writeln(ypSlideOutMenu.Registry[id].css);
}
document.writeln('</style>');
}
ypSlideOutMenu.prototype.load = function() {
var d = document
var lyrId1 = this.id + "Container"
var lyrId2 = this.id + "Content"
var obj1 = this.dom ? d.getElementById(lyrId1) : this.ie ? d.all[lyrId1] : d.layers[lyrId1]
if (obj1) var obj2 = this.ns4 ? obj1.layers[lyrId2] : this.ie ? d.all[lyrId2] : d.getElementById(lyrId2)
var temp
if (!obj1 || !obj2) window.setTimeout(this.gRef + ".load()", 100)
else {
this.container = obj1
this.menu = obj2
this.style = this.ns4 ? this.menu : this.menu.style
this.homePos = eval("0" + this.dirType + this.dim)
this.outPos = 0
this.accelConst = (this.outPos - this.homePos) / ypSlideOutMenu.aniLen / ypSlideOutMenu.aniLen
// set event handlers.
if (this.ns4) this.menu.captureEvents(Event.MOUSEOVER | Event.MOUSEOUT);
this.menu.onmouseover = new Function("ypSlideOutMenu.showMenu('" + this.id + "')")
this.menu.onmouseout = new Function("ypSlideOutMenu.hideMenu('" + this.id + "')")
//set initial state
this.endSlide()
}
}
ypSlideOutMenu.showMenu = function(id)
{
var reg = ypSlideOutMenu.Registry
var obj = ypSlideOutMenu.Registry[id]
if (obj.container) {
obj.over = true
// close other menus.
for (menu in reg) if (id != menu) ypSlideOutMenu.hide(menu)
// if this menu is scheduled to close, cancel it.
if (obj.hideTimer) { reg[id].hideTimer = window.clearTimeout(reg[id].hideTimer) }
// if this menu is closed, open it.
if (!obj.open && !obj.aniTimer) reg[id].startSlide(true)
}
}
ypSlideOutMenu.hideMenu = function(id)
{
// schedules the menu to close after <hideDelay> ms, which
// gives the user time to cancel the action if they accidentally moused out
var obj = ypSlideOutMenu.Registry[id]
if (obj.container) {
if (obj.hideTimer) window.clearTimeout(obj.hideTimer)
obj.hideTimer = window.setTimeout("ypSlideOutMenu.hide('" + id + "')", ypSlideOutMenu.hideDelay);
}
}
ypSlideOutMenu.hideAll = function()
{
var reg = ypSlideOutMenu.Registry
for (menu in reg) {
ypSlideOutMenu.hide(menu);
if (menu.hideTimer) window.clearTimeout(menu.hideTimer);
}
}
ypSlideOutMenu.hide = function(id)
{
var obj = ypSlideOutMenu.Registry[id]
obj.over = false
if (obj.hideTimer) window.clearTimeout(obj.hideTimer)
// flag that this scheduled event has occured.
obj.hideTimer = 0
// if this menu is open, close it.
if (obj.open && !obj.aniTimer) obj.startSlide(false)
}
ypSlideOutMenu.prototype.startSlide = function(open) {
this[open ? "onactivate" : "ondeactivate"]()
this.open = open
if (open) this.setVisibility(true)
this.startTime = (new Date()).getTime()
this.aniTimer = window.setInterval(this.gRef + ".slide()", ypSlideOutMenu.minCPUResolution)
}
ypSlideOutMenu.prototype.slide = function() {
var elapsed = (new Date()).getTime() - this.startTime
if (elapsed > ypSlideOutMenu.aniLen) this.endSlide()
else {
var d = Math.round(Math.pow(ypSlideOutMenu.aniLen-elapsed, 2) * this.accelConst)
if (this.open && this.dirType == "-") d = -d
else if (this.open && this.dirType == "+") d = -d
else if (!this.open && this.dirType == "-") d = -this.dim + d
else d = this.dim + d
this.moveTo(d)
}
}
ypSlideOutMenu.prototype.endSlide = function() {
this.aniTimer = window.clearTimeout(this.aniTimer)
this.moveTo(this.open ? this.outPos : this.homePos)
if (!this.open) this.setVisibility(false)
if ((this.open && !this.over) || (!this.open && this.over)) {
this.startSlide(this.over)
}
}
ypSlideOutMenu.prototype.setVisibility = function(bShow) {
var s = this.ns4 ? this.container : this.container.style
s.visibility = bShow ? "visible" : "hidden"
}
ypSlideOutMenu.prototype.moveTo = function(p) {
this.style[this.orientation == "h" ? "left" : "top"] = this.ns4 ? p : p + "px"
}
ypSlideOutMenu.prototype.getPos = function(c) {
return parseInt(this.style[c])
}
// events
ypSlideOutMenu.prototype.onactivate = function() { }
ypSlideOutMenu.prototype.ondeactivate = function() { }
</script>
<script type="text/javascript">
<!--
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_swapImgRestore() {
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() {
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_swapImage() {
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
<style type="text/css">
#globalMenu { /*메뉴 가장자리를 감싸는 영역*/
height:25px;
margin:0 0 0 0; /*시계방향 top, right, bottom, left 공통*/
padding:0 0 0 0;
border:1px solid white;
background-color:transparent;
position:relative;
}
#groupMenu { /*그룹메뉴 영역*/
float:left;
width:100px;
height:25px;
margin:0 0 0 2;
border:0px solid #FEFFED;
background-color:transparent;
position:relative;
}
a.groupName { /*그룹제목 스타일*/
padding-top:5px;
font:bold 12px 굴림;
height:25px;
text-align:center;
cursor:pointer;
display:block; /*포인터 영역 확대*/
}
/*각 그룹의 게시판 메뉴위치 relative */
#boardDiv {
position:relative;
}
.boardLayer { /*전체 게시판 레이어 영역*/
width:125px;
height:inherit;
border-top:1px solid orange;/*맨위 테두리만 여기서 설정*/
background-color:#transparent;/*배경색상으로 입체효과 가능 - 색상을 주어 서브메뉴의 영역 확인가능*/
z-index:999;
}
.boardSubject { /*각 게시판 제목 스타일*/
height:16px;
width:128px;
/*각 영역에서 나머지 테두리는 여기서 설정 ?=>FF*/
border-bottom:1px solid #ff9900;
border-left:1px solid #FF9900;
border-right:1px solid #FF9900;
border-top:0px solid #FF9900;
background-color:white;
padding:5 0 1 0;
margin-bottom:0px;/*각 영역사이 마진 - 입체감을 주려면 줘보라*/
-moz-opacity: .90;
filter: alpha(opacity=90);
}
a.boardName { /*게시판 제목 링크 스타일*/
width:125px; /*block 설정시 너비 빼먹으면 msie에서 안먹힘*/
padding-left:10px;
font:12px 굴림;
display:block; /*포인터 영역 확대*/
}
/*현재 사용 안 함*/
a.on:link, a.on:visited, a.on:active { /*해당 그룹 강조*/
color:#45436c;
}
a.on:hover { /**/
color:orange;
}
a.off:link, a.off:visited, a.off:active { /*일반 그룹*/
color:green;
}
a.off:hover { /**/
color:orange;
}
</style><?
// rolo님 메뉴스킨 라이브러리 참조, 일반적인 조건으로 쿼리
// 그룹 정렬 - gr_1 오름 차순
// 제외 그룹 - 접근사용 yes, 게시판이 없는 그룹, 제외 게시판만 있는 그룹
// 게시판 정렬 - 전체 검색 오름 차순
// 제외 게시판 - 전체 검색 사용 no, 목록열람 레벨
$list = array();
// 위 에서 명시한 그룹외에 제외시키고자 하는 그룹을 수동으로 추가
$exc = "('그룹아이디1', '그룹아이디2', '그룹아이디3')";
$sql= "select G.gr_id, G.gr_subject, G.gr_use_access, B.bo_use_search, B.bo_table, substring_index( bo_subject, ';', 1) bo_subject from $g4[group_table] G inner join $g4[board_table] B using (gr_id) where G.gr_use_access = '0' and G.gr_id not in {$exc} and B.bo_use_search = '1' and (bo_list_level <= $member[mb_level]) order by gr_1 ASC, bo_order_search ASC ";
$result = sql_query($sql);
for ($i=0; $row = sql_fetch_array($result); $i++) {
//$list[$row['gr_id']]['gr_id'] = $row['gr_id'];//이 줄은 배열값을 얻은후 다시 주석처리 합니다.
$list[$row['gr_id']]['gr_subject'] = $row['gr_subject'];
$list[$row['gr_id']]['bbs'][] = array( 'bo_table'=> $row['bo_table'], 'bo_subject'=>$row['bo_subject']);
}
// 그룹별 서브메뉴 개별 환경설정시 아래를 반드시 참고해야 합니다.
// 다양한 옵션을 이용하려면 이 개별 환경설정을 사용해야 합니다.
// 1, 위 반복문의 첫줄 주석을 풀어줍니다.
// 2, 아래 세줄의 주석을 풀고 메뉴가 링크된 페이지로 가서 그룹 배열값을 얻는다.
//foreach( $list as $key => $value)
//$grId[] = $value['gr_id']; //분류 구분
//print_r2 ($grId);// 3, 이 줄과 반복문의 주석처리된 줄은 배열값을 얻은후 다시 주석처리 합니다.
?>
<script language="javascript">
//###### 그룹별 서브메뉴 개별 환경설정 시작
//# 일괄 환경설정시 모두 주석처리합니다.
// 4, 위에서 얻은 그룹 배열값을 참고해서 그룹별 서브메뉴의 시작위치,x좌표,y좌표,너비,높이만 설정
// var <?=$grId[0]?> = new ypSlideOutMenu("<?=$grId[0]?>", "right", 0, 1, 122, 105)
// var <?=$grId[1]?> = new ypSlideOutMenu("<?=$grId[1]?>", "up", 0, 1, 122, 147)
// var <?=$grId[2]?> = new ypSlideOutMenu("<?=$grId[2]?>", "down", 0, 1, 122, 308)
//###### 개별 환경설정 끝
//###### 전체그룹 서브메뉴 일괄 환경설정 시작
//# 개별 환경설정시 모두 주석처리합니다.
//# 가장 넓고 높은 그룹을 기준으로 너비와 높이를 설정하면 됩니다.
//# 이경우 보이지 않는 이 영역에 마우스가 올라가 있으면 서브메뉴가 사라지지 않습니다.
//# 매우 귀찮거나 메뉴 크기가 크게 다르지 않을때, 테스트 외에는 권장하지 않는 방법입니다.
<?
foreach( $list as $key => $value) {
//#################################### 서브메뉴의 시작위치,x좌표,y좌표,너비,높이만 설정
?>var <?=$key?> = new ypSlideOutMenu("<?=$key?>", "down", 0, 1, 130, 350);<?
}
?>
//###### 일괄 환경설정 끝
ypSlideOutMenu.writeCSS();
</script><?
//$gBtnpath = "이미지 폴더 경로" ."/". "gBtn";/* 그룹 버튼 이미지 폴더 gBtn */
$gBtnpath = "$g4[path]" ."/". "gallery/images/menu";/* 그룹 버튼 이미지 폴더 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='globalMenu'>
<div style='float:left; padding:5 0 0 0;'></div><?
// ## group
$menu_size= count( $list);
foreach( $list as $key=> $value) {
?><div id='groupMenu'><?
if (!is_dir($gBtnpath)) {/* 이미지 폴더가 없다면 텍스트 스타일(기본) */
$style = "";
if ($key == $gur)//해당 그룹 강조
$style = "style='font-weight:bold; color:#45436c;'";
$gr_subject = "<span $style>" . cut_str(get_text($value['gr_subject']),20,"") . "</span>";
?><span><a href='<?=$g4['path']?><?=$key == "sample_gal"?'/gallery/?gur':'/?gur';/*특정그룹 경로*/?>=<?=$key?>' onmouseover="ypSlideOutMenu.showMenu('<?=$key?>')" onmouseout="ypSlideOutMenu.hideMenu('<?=$key?>')" class='groupName'><?=$gr_subject?></a></span><?
}
else {
/* 이미지 폴더가 있다면 이미지로 표시(옵션)
* 기본 이미지 - 그룹아이디_1.gif *
* 롤오버 이미지 - 그룹아이디_2.gif */
?><span style="width:100px;height:30px;border:0px solid gray;text-align:center;vertical-align:middle;cursor:pointer;"><a href='<?=$g4['path']?><?=$key == "sample_gal"?'/gallery/?gur':'/?gur';/*특정그룹 경로*/?>=<?=$key?>' onMouseOver="ypSlideOutMenu.showMenu('<?=$key?>'), MM_swapImage('<?=$key?>','','<?=$gBtnpath?>/<?=$key?>_2.gif',1)" onMouseOut="ypSlideOutMenu.hideMenu('<?=$key?>'), MM_swapImgRestore()" onfocus='this.blur()'><?
if ($key == $gur){//해당 그룹 표시
?><img src="<?=$gBtnpath?>/<?=$key?>_2.gif" width="100" height="30" border=0 name="<?=$key?>" alt="<?=$key?>"></a></span><?
}else{
?><img src="<?=$gBtnpath?>/<?=$key?>_1.gif" width="100" height="30" border=0 name="<?=$key?>" alt="<?=$key?>"></a></span><?
}
}
?><div id='boardDiv'>
<div id="<?=$key?>Container">
<div id="<?=$key?>Content" class="boardLayer"><?
// # board
foreach( $value['bbs'] as $name) {
$style = "";
if ($name['bo_table'] == $bo_table)//해당 게시판 강조
$style = "style='font-weight:normal; color:red;'";
$bo_subject = "<span $style>" . cut_str(get_text($name['bo_subject']),20,"") . "</span>";
?><div class='boardSubject'><a href='<?=$g4['bbs_path']?>/board.php?bo_table=<?=$name['bo_table']?>' class='boardName'><?=$bo_subject?></a></div><?
}
?></div></div></div>
</div><?// group end
}//foreach 주메뉴 끝
?></div><!-- global end -->
<div style='clear: both;'></div><!-- 메뉴끝 줄 바꿈, 겹침 방지 -->
<?//print_r2 ($list);?>
저로서는 며칠을 고민ㅤㅎㅏㄷ가 올리는 것이 너른 양해를 구합니다.
뭔고 허면, 자동메뉴로 올려주신 소스를 가지고 메뉴를 올리려고 하니 게시판은 잘 나오는데 그룹은 안나오는군요.
그룹은 ../group.php?gr_id=그룹아이디 이렇게 해서 불려지는 것으로 알고 있는데 제가 받은 소스는 ../?gur=그룹 아이디 로 불러오는군요. 결국 원하는 그룹의 게시판만이 아니라 모든 게시판을 불러오고 있습니다.
어디를 고쳐야 할지 몰라서 슬라이드 메뉴 전체소스를 올립니다.
=========================================
<? if (!defined("_GNUBOARD_")) exit;// gb_ypSlideRF.php - multi Style
##################################################################
# 라이브러리 - http://sir.co.kr/bbs/tb.php/g4_tiptech/5673 rolo님 라이센스(GNU General Public License)
# 라이브러리 및 스크립트의 라이센스 정책에 일치하는 경우에만 사용하십시오.
# ypSlideOutMenus.js 카피라이트와 gb_ypSlideRF.php 상단 주석 삭제금지
##################### by floc http://www.opensource.org/licenses/afl-2.0.php
*
* Revised:
* - 08/29/2002 : added .hideAll()
* - 04/15/2004 : added .writeCSS() to support more
* than 30 menus.
*
* --youngpup--
*****************************************************/
ypSlideOutMenu.Registry = []
ypSlideOutMenu.aniLen = 500//슬라이딩 속도 250
ypSlideOutMenu.hideDelay = 500//숨김 지연시간 1000
ypSlideOutMenu.minCPUResolution = 10//응답 감도 10
// constructor
function ypSlideOutMenu(id, dir, left, top, width, height)
{
this.ie = document.all ? 1 : 0
this.ns4 = document.layers ? 1 : 0
this.dom = document.getElementById ? 1 : 0
this.css = "";
if (this.ie || this.ns4 || this.dom) {
this.id = id
this.dir = dir
this.orientation = dir == "left" || dir == "right" ? "h" : "v"
this.dirType = dir == "right" || dir == "down" ? "-" : "+"
this.dim = this.orientation == "h" ? width : height
this.hideTimer = false
this.aniTimer = false
this.open = false
this.over = false
this.startTime = 0
// global reference to this object
this.gRef = "ypSlideOutMenu_"+id
eval(this.gRef+"=this")
// add this menu object to an internal list of all menus
ypSlideOutMenu.Registry[id] = this
var d = document
var strCSS = "";
strCSS += '#' + this.id + 'Container { visibility:hidden; '
strCSS += 'left:' + left + 'px; '
strCSS += 'top:' + top + 'px; '
strCSS += 'overflow:hidden; z-index:10000; }'
strCSS += '#' + this.id + 'Container, #' + this.id + 'Content { position:absolute; '
strCSS += 'width:' + width + 'px; '
strCSS += 'height:' + height + 'px; '
strCSS += 'clip:rect(0 ' + width + ' ' + height + ' 0); '
strCSS += '}'
this.css = strCSS;
this.load()
}
}
ypSlideOutMenu.writeCSS = function() {
document.writeln('<style type="text/css">');
for (var id in ypSlideOutMenu.Registry) {
document.writeln(ypSlideOutMenu.Registry[id].css);
}
document.writeln('</style>');
}
ypSlideOutMenu.prototype.load = function() {
var d = document
var lyrId1 = this.id + "Container"
var lyrId2 = this.id + "Content"
var obj1 = this.dom ? d.getElementById(lyrId1) : this.ie ? d.all[lyrId1] : d.layers[lyrId1]
if (obj1) var obj2 = this.ns4 ? obj1.layers[lyrId2] : this.ie ? d.all[lyrId2] : d.getElementById(lyrId2)
var temp
if (!obj1 || !obj2) window.setTimeout(this.gRef + ".load()", 100)
else {
this.container = obj1
this.menu = obj2
this.style = this.ns4 ? this.menu : this.menu.style
this.homePos = eval("0" + this.dirType + this.dim)
this.outPos = 0
this.accelConst = (this.outPos - this.homePos) / ypSlideOutMenu.aniLen / ypSlideOutMenu.aniLen
// set event handlers.
if (this.ns4) this.menu.captureEvents(Event.MOUSEOVER | Event.MOUSEOUT);
this.menu.onmouseover = new Function("ypSlideOutMenu.showMenu('" + this.id + "')")
this.menu.onmouseout = new Function("ypSlideOutMenu.hideMenu('" + this.id + "')")
//set initial state
this.endSlide()
}
}
ypSlideOutMenu.showMenu = function(id)
{
var reg = ypSlideOutMenu.Registry
var obj = ypSlideOutMenu.Registry[id]
if (obj.container) {
obj.over = true
// close other menus.
for (menu in reg) if (id != menu) ypSlideOutMenu.hide(menu)
// if this menu is scheduled to close, cancel it.
if (obj.hideTimer) { reg[id].hideTimer = window.clearTimeout(reg[id].hideTimer) }
// if this menu is closed, open it.
if (!obj.open && !obj.aniTimer) reg[id].startSlide(true)
}
}
ypSlideOutMenu.hideMenu = function(id)
{
// schedules the menu to close after <hideDelay> ms, which
// gives the user time to cancel the action if they accidentally moused out
var obj = ypSlideOutMenu.Registry[id]
if (obj.container) {
if (obj.hideTimer) window.clearTimeout(obj.hideTimer)
obj.hideTimer = window.setTimeout("ypSlideOutMenu.hide('" + id + "')", ypSlideOutMenu.hideDelay);
}
}
ypSlideOutMenu.hideAll = function()
{
var reg = ypSlideOutMenu.Registry
for (menu in reg) {
ypSlideOutMenu.hide(menu);
if (menu.hideTimer) window.clearTimeout(menu.hideTimer);
}
}
ypSlideOutMenu.hide = function(id)
{
var obj = ypSlideOutMenu.Registry[id]
obj.over = false
if (obj.hideTimer) window.clearTimeout(obj.hideTimer)
// flag that this scheduled event has occured.
obj.hideTimer = 0
// if this menu is open, close it.
if (obj.open && !obj.aniTimer) obj.startSlide(false)
}
ypSlideOutMenu.prototype.startSlide = function(open) {
this[open ? "onactivate" : "ondeactivate"]()
this.open = open
if (open) this.setVisibility(true)
this.startTime = (new Date()).getTime()
this.aniTimer = window.setInterval(this.gRef + ".slide()", ypSlideOutMenu.minCPUResolution)
}
ypSlideOutMenu.prototype.slide = function() {
var elapsed = (new Date()).getTime() - this.startTime
if (elapsed > ypSlideOutMenu.aniLen) this.endSlide()
else {
var d = Math.round(Math.pow(ypSlideOutMenu.aniLen-elapsed, 2) * this.accelConst)
if (this.open && this.dirType == "-") d = -d
else if (this.open && this.dirType == "+") d = -d
else if (!this.open && this.dirType == "-") d = -this.dim + d
else d = this.dim + d
this.moveTo(d)
}
}
ypSlideOutMenu.prototype.endSlide = function() {
this.aniTimer = window.clearTimeout(this.aniTimer)
this.moveTo(this.open ? this.outPos : this.homePos)
if (!this.open) this.setVisibility(false)
if ((this.open && !this.over) || (!this.open && this.over)) {
this.startSlide(this.over)
}
}
ypSlideOutMenu.prototype.setVisibility = function(bShow) {
var s = this.ns4 ? this.container : this.container.style
s.visibility = bShow ? "visible" : "hidden"
}
ypSlideOutMenu.prototype.moveTo = function(p) {
this.style[this.orientation == "h" ? "left" : "top"] = this.ns4 ? p : p + "px"
}
ypSlideOutMenu.prototype.getPos = function(c) {
return parseInt(this.style[c])
}
// events
ypSlideOutMenu.prototype.onactivate = function() { }
ypSlideOutMenu.prototype.ondeactivate = function() { }
</script>
<script type="text/javascript">
<!--
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_swapImgRestore() {
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() {
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_swapImage() {
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
<style type="text/css">
#globalMenu { /*메뉴 가장자리를 감싸는 영역*/
height:25px;
margin:0 0 0 0; /*시계방향 top, right, bottom, left 공통*/
padding:0 0 0 0;
border:1px solid white;
background-color:transparent;
position:relative;
}
#groupMenu { /*그룹메뉴 영역*/
float:left;
width:100px;
height:25px;
margin:0 0 0 2;
border:0px solid #FEFFED;
background-color:transparent;
position:relative;
}
a.groupName { /*그룹제목 스타일*/
padding-top:5px;
font:bold 12px 굴림;
height:25px;
text-align:center;
cursor:pointer;
display:block; /*포인터 영역 확대*/
}
/*각 그룹의 게시판 메뉴위치 relative */
#boardDiv {
position:relative;
}
.boardLayer { /*전체 게시판 레이어 영역*/
width:125px;
height:inherit;
border-top:1px solid orange;/*맨위 테두리만 여기서 설정*/
background-color:#transparent;/*배경색상으로 입체효과 가능 - 색상을 주어 서브메뉴의 영역 확인가능*/
z-index:999;
}
.boardSubject { /*각 게시판 제목 스타일*/
height:16px;
width:128px;
/*각 영역에서 나머지 테두리는 여기서 설정 ?=>FF*/
border-bottom:1px solid #ff9900;
border-left:1px solid #FF9900;
border-right:1px solid #FF9900;
border-top:0px solid #FF9900;
background-color:white;
padding:5 0 1 0;
margin-bottom:0px;/*각 영역사이 마진 - 입체감을 주려면 줘보라*/
-moz-opacity: .90;
filter: alpha(opacity=90);
}
a.boardName { /*게시판 제목 링크 스타일*/
width:125px; /*block 설정시 너비 빼먹으면 msie에서 안먹힘*/
padding-left:10px;
font:12px 굴림;
display:block; /*포인터 영역 확대*/
}
/*현재 사용 안 함*/
a.on:link, a.on:visited, a.on:active { /*해당 그룹 강조*/
color:#45436c;
}
a.on:hover { /**/
color:orange;
}
a.off:link, a.off:visited, a.off:active { /*일반 그룹*/
color:green;
}
a.off:hover { /**/
color:orange;
}
</style><?
// rolo님 메뉴스킨 라이브러리 참조, 일반적인 조건으로 쿼리
// 그룹 정렬 - gr_1 오름 차순
// 제외 그룹 - 접근사용 yes, 게시판이 없는 그룹, 제외 게시판만 있는 그룹
// 게시판 정렬 - 전체 검색 오름 차순
// 제외 게시판 - 전체 검색 사용 no, 목록열람 레벨
$list = array();
// 위 에서 명시한 그룹외에 제외시키고자 하는 그룹을 수동으로 추가
$exc = "('그룹아이디1', '그룹아이디2', '그룹아이디3')";
$sql= "select G.gr_id, G.gr_subject, G.gr_use_access, B.bo_use_search, B.bo_table, substring_index( bo_subject, ';', 1) bo_subject from $g4[group_table] G inner join $g4[board_table] B using (gr_id) where G.gr_use_access = '0' and G.gr_id not in {$exc} and B.bo_use_search = '1' and (bo_list_level <= $member[mb_level]) order by gr_1 ASC, bo_order_search ASC ";
$result = sql_query($sql);
for ($i=0; $row = sql_fetch_array($result); $i++) {
//$list[$row['gr_id']]['gr_id'] = $row['gr_id'];//이 줄은 배열값을 얻은후 다시 주석처리 합니다.
$list[$row['gr_id']]['gr_subject'] = $row['gr_subject'];
$list[$row['gr_id']]['bbs'][] = array( 'bo_table'=> $row['bo_table'], 'bo_subject'=>$row['bo_subject']);
}
// 그룹별 서브메뉴 개별 환경설정시 아래를 반드시 참고해야 합니다.
// 다양한 옵션을 이용하려면 이 개별 환경설정을 사용해야 합니다.
// 1, 위 반복문의 첫줄 주석을 풀어줍니다.
// 2, 아래 세줄의 주석을 풀고 메뉴가 링크된 페이지로 가서 그룹 배열값을 얻는다.
//foreach( $list as $key => $value)
//$grId[] = $value['gr_id']; //분류 구분
//print_r2 ($grId);// 3, 이 줄과 반복문의 주석처리된 줄은 배열값을 얻은후 다시 주석처리 합니다.
?>
<script language="javascript">
//###### 그룹별 서브메뉴 개별 환경설정 시작
//# 일괄 환경설정시 모두 주석처리합니다.
// 4, 위에서 얻은 그룹 배열값을 참고해서 그룹별 서브메뉴의 시작위치,x좌표,y좌표,너비,높이만 설정
// var <?=$grId[0]?> = new ypSlideOutMenu("<?=$grId[0]?>", "right", 0, 1, 122, 105)
// var <?=$grId[1]?> = new ypSlideOutMenu("<?=$grId[1]?>", "up", 0, 1, 122, 147)
// var <?=$grId[2]?> = new ypSlideOutMenu("<?=$grId[2]?>", "down", 0, 1, 122, 308)
//###### 개별 환경설정 끝
//###### 전체그룹 서브메뉴 일괄 환경설정 시작
//# 개별 환경설정시 모두 주석처리합니다.
//# 가장 넓고 높은 그룹을 기준으로 너비와 높이를 설정하면 됩니다.
//# 이경우 보이지 않는 이 영역에 마우스가 올라가 있으면 서브메뉴가 사라지지 않습니다.
//# 매우 귀찮거나 메뉴 크기가 크게 다르지 않을때, 테스트 외에는 권장하지 않는 방법입니다.
<?
foreach( $list as $key => $value) {
//#################################### 서브메뉴의 시작위치,x좌표,y좌표,너비,높이만 설정
?>var <?=$key?> = new ypSlideOutMenu("<?=$key?>", "down", 0, 1, 130, 350);<?
}
?>
//###### 일괄 환경설정 끝
ypSlideOutMenu.writeCSS();
</script><?
//$gBtnpath = "이미지 폴더 경로" ."/". "gBtn";/* 그룹 버튼 이미지 폴더 gBtn */
$gBtnpath = "$g4[path]" ."/". "gallery/images/menu";/* 그룹 버튼 이미지 폴더 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='globalMenu'>
<div style='float:left; padding:5 0 0 0;'></div><?
// ## group
$menu_size= count( $list);
foreach( $list as $key=> $value) {
?><div id='groupMenu'><?
if (!is_dir($gBtnpath)) {/* 이미지 폴더가 없다면 텍스트 스타일(기본) */
$style = "";
if ($key == $gur)//해당 그룹 강조
$style = "style='font-weight:bold; color:#45436c;'";
$gr_subject = "<span $style>" . cut_str(get_text($value['gr_subject']),20,"") . "</span>";
?><span><a href='<?=$g4['path']?><?=$key == "sample_gal"?'/gallery/?gur':'/?gur';/*특정그룹 경로*/?>=<?=$key?>' onmouseover="ypSlideOutMenu.showMenu('<?=$key?>')" onmouseout="ypSlideOutMenu.hideMenu('<?=$key?>')" class='groupName'><?=$gr_subject?></a></span><?
}
else {
/* 이미지 폴더가 있다면 이미지로 표시(옵션)
* 기본 이미지 - 그룹아이디_1.gif *
* 롤오버 이미지 - 그룹아이디_2.gif */
?><span style="width:100px;height:30px;border:0px solid gray;text-align:center;vertical-align:middle;cursor:pointer;"><a href='<?=$g4['path']?><?=$key == "sample_gal"?'/gallery/?gur':'/?gur';/*특정그룹 경로*/?>=<?=$key?>' onMouseOver="ypSlideOutMenu.showMenu('<?=$key?>'), MM_swapImage('<?=$key?>','','<?=$gBtnpath?>/<?=$key?>_2.gif',1)" onMouseOut="ypSlideOutMenu.hideMenu('<?=$key?>'), MM_swapImgRestore()" onfocus='this.blur()'><?
if ($key == $gur){//해당 그룹 표시
?><img src="<?=$gBtnpath?>/<?=$key?>_2.gif" width="100" height="30" border=0 name="<?=$key?>" alt="<?=$key?>"></a></span><?
}else{
?><img src="<?=$gBtnpath?>/<?=$key?>_1.gif" width="100" height="30" border=0 name="<?=$key?>" alt="<?=$key?>"></a></span><?
}
}
?><div id='boardDiv'>
<div id="<?=$key?>Container">
<div id="<?=$key?>Content" class="boardLayer"><?
// # board
foreach( $value['bbs'] as $name) {
$style = "";
if ($name['bo_table'] == $bo_table)//해당 게시판 강조
$style = "style='font-weight:normal; color:red;'";
$bo_subject = "<span $style>" . cut_str(get_text($name['bo_subject']),20,"") . "</span>";
?><div class='boardSubject'><a href='<?=$g4['bbs_path']?>/board.php?bo_table=<?=$name['bo_table']?>' class='boardName'><?=$bo_subject?></a></div><?
}
?></div></div></div>
</div><?// group end
}//foreach 주메뉴 끝
?></div><!-- global end -->
<div style='clear: both;'></div><!-- 메뉴끝 줄 바꿈, 겹침 방지 -->
<?//print_r2 ($list);?>
댓글 전체