메인메뉴 바로가기

HOME으로 가기


Javascript

사용자함수 | 자동 메뉴생성 함수 (PHP활용)

첨부파일

본문

 

 

-----[ get_dir.php ]-------

 

 

<?php

$ScanPath = $_REQUEST['scan_path'];

$Dir= dir("../dev/".$ScanPath);

$cnt = 0;

echo "[";

while ( ($entry = $Dir->read()) != false) {

  if( ($entry != "..") && ($entry != ".") ) {

 if($cnt > 0) echo ",";

 echo "'".$entry."'";

 $cnt++;

  }

}

$Dir->close();

echo "]";

?> 

 

 

 

-----[ page,php ]------

 

<?php

 

$path = $_REQUEST['path'];

$file = $_REQUEST['file'];

 

include "../dev/common/inc_header.php";

include $path.$file;

include "../dev/common/inc_footer.php";

?> 

 

 

 

 

 

--- [ menu.php ] CSS/HTML/JS ---

 

-- CSS --

body { color:#999; background-color:#f5f5f5; margin:0; padding:0; line-height:1.6em; font-size:12px }

a { text-decoration:none;color:#c30; display:inline-block; padding:2px 5px;  }

a.dimmed { color:#aaa; }

a.ok {color:#093;}

a:hover { color:#960; }

a.dimmed:hover { color:#bbb; }

a.on, a:hover.on { font-weight:bold;  color:#fff; background-color:#f60 } 

ol { list-style:none; padding:0; }

li { padding:0;}

button { background:url(close.gif) left center no-repeat; width:100%; padding:3px 3px 3px 30px; cursor:pointer; text-align:left; border:0; background-color:transparent; }

button.open { background-image:url(open.gif) }

body > ol { list-style:none;  padding:0 ; margin:0;  }

body ol > li { padding:0; margin:0;border-top: 1px solid #ccc;} 

body > ol > li {border-top: 2px dotted #ccc;}

h1,h2,h3,h4,h5,h6 { margin:0; padding:0; font-size:inherit }

h1 > button { margin-left:0; font-size: 2em; color:#fff; padding:5px;  font-family: "NanumGothic","맑은고딕";  

font-weight:bold; background-color:#069; cursor:pointer; background-image:none; }

h2 > button  { margin-left:10px;font-size: 1.8em; color:#222;  }

h3 > button  { margin-left:20px;font-size: 1.6em; color:#444; border-bottom: 1px dotted #ccc; }

h4 > button  { margin-left:30px;font-size: 1.4em; color:#666; border-bottom: 1px dotted #ccc; }

h5 > button  { margin-left:40px;font-size: 1.2em; color:#888; border-bottom: 1px dotted #ccc; }

h6 > button  { margin-left:50px;font-size: 1em; color:#aaa; border-bottom: 1px dotted #ccc; }

ul { margin-left:40px; list-style-position:inside; }  

 

 

-- HTML--

<ol>

    <li><h1><button onclick="Menu.clickMenu(this); return false;">Summary</button></h1></li>

</ol> 

 

-- Javascript -- 

var Menu = {

nowA : null,

clickMenu : function(btn){

var ThisDepth = parseInt(btn.parentNode.nodeName.substring(1),10);

Menu.appendDir(btn.innerText, btn.parentNode.parentNode, ThisDepth, btn.value);

btn.value = 1;

$(btn).parent().next().toggle();

if(btn.parentNode.nodeName != "H1") $(btn).toggleClass("open");

},

clickA : function(a){

if(Menu.nowA) Menu.nowA.className = "";

Menu.nowA = a;

Menu.nowA.className = "on";

var FileName = Menu.nowA.innerText;

var H6_li = Menu.nowA.parentNode.parentNode.parentNode;

var H5_li = H6_li.parentNode.parentNode;

var H4_li = H5_li.parentNode.parentNode;

var H3_li = H4_li.parentNode.parentNode;

var H2_li = H3_li.parentNode.parentNode;

var H1_li = H2_li.parentNode.parentNode;

var FilePath = "../dev/";

FilePath += H1_li.getElementsByTagName("button")[0].innerText + "/";

FilePath += H2_li.getElementsByTagName("button")[0].innerText + "/";

FilePath += H3_li.getElementsByTagName("button")[0].innerText + "/";

FilePath += H4_li.getElementsByTagName("button")[0].innerText + "/";

FilePath += H5_li.getElementsByTagName("button")[0].innerText + "/";

FilePath += H6_li.getElementsByTagName("button")[0].innerText + "/";

window.open("page.php?path="+FilePath+"&file="+FileName,"page_view"); 

},

appendDir : function(path,trg,depth,value){

if(value) return false;

var Path =path;

if(depth >1) Path = trg.parentNode.parentNode.getElementsByTagName("button")[0].innerText + "/"+Path;

if(depth >2) Path = trg.parentNode.parentNode.parentNode.parentNode.getElementsByTagName("button")[0].innerText + "/"+Path;

if(depth >3) Path = trg.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.getElementsByTagName("button")[0].innerText + "/"+Path;

if(depth >4) Path = trg.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.getElementsByTagName("button")[0].innerText + "/"+Path;

if(depth >5) Path = trg.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.getElementsByTagName("button")[0].innerText + "/"+Path;

$.ajax({

url: "get_dir.php?scan_path="+Path,

dataType: "text",

success: function (data)

{

var Lists = eval(data);

    Lists = Lists.sort();

if(depth > 0){

if(depth == 6){

var ListTag = '<ul>'

for(var i=0; i<Lists.length; i++){

if(Lists[i].indexOf(".php") != -1) ListTag += '<li><a href="#" onclick="Menu.clickA(this); return false;">'+Lists[i]+'</a>';

}

ListTag += '</ul>';

}else{

var ListTag = '<ol>'

for(var i=0; i<Lists.length; i++){

if( Lists[i] != undefined && Lists[i] != "sample" && Lists[i].indexOf(".php") == -1) {

ListTag += '<li><H'+(depth+1)+'><button onclick="Menu.clickMenu(this); return false;">'+Lists[i]+'</button></H'+(depth+1)+'>';

}

}

ListTag += '</ol>';

}

$(trg).append(ListTag);

}

}

});

}

}

$("body > ol ol, body > ol ul").hide(); 

 

 

--- [ index.html ] ---

<!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>프레임셋</title>

</head>

<frameset cols="400,*"  frameborder="0">

<frame name="list_menu" src="menu.php"></frame>

<frame name="page_view" src=""></frame>

</frameset><noframes></noframes>

</html>

 

  • 페이스북으로 보내기
  • 트위터로 보내기
  • 구글플러스로 보내기