မိမိရဲ ့ဘေလာ့ဂ္မွာ ေပးခ်င္တဲ့ လင့္ေလးေတြကို Tree Menu ေလးေတြ မထည့္ခ်င္ၾကဘူးလား..
ဒီလိုပံုစံေလးနဲ ့ေပါ့...
ကၽြန္ေတာ့္ရဲ ့ ဘေလာ့ဂ္မွာလည္း ထည့္ထားပါတယ္...
ပထမအဆင့္အေနနဲ ့ Blogger Dashboard ရဲ ့ Layout ထဲက Edit HTML ကို သြားပါ...
ၿပီးရင္ <head> ကို ရွာၿပီး သူ ့အေပၚမွာ..
<link rel="StyleSheet" href="http://namelesscreator.googlepages.com/dtree.css" type="text/css" />
<script type="text/javascript" src="http://namelesscreator.googlepages.com/dtree.js"></script>
ဆိုတဲ့ Code ေလးေတြကို ထည့္ပါ..
ၿပီးပါက Template ကို Save လုပ္ပါ...
ဒုတိယအဆင့္အေနနဲ ့... Layout ေအာက္ကေန Add a Page Element ( or ) Add a Gadget ကိုႏွိပ္ၿပီး HTML/Java Script ကို သြားပါ... ၿပီးရင္ ဒီ Code ေလးေတြကို ထည့္ပါ...
<div class="dtree">
<script type="text/javascript">
<!--
d = new dTree('d');
d.add(0,-1,'My example tree');
d.add(1,0,'Node 1','link.html');
d.add(2,1,'Node 1.1','link.html');
d.add(3,2,'Node 1.1.1','link.html');
d.add(4,3,'Node 1.1.1.1','link.html');
d.add(5,0,'Node 2','link.html');
d.add(6,5,'Node 2.1','link.html');
d.add(7,5,'Node 2.2','link.html');
d.add(8,0,'Node 3','link.html');
d.add(9,0,'Node 5','link.html');
document.write(d);
//-->
</script>
</div>
အနီေရာင္ စာသား 'My example tree' ဆိုတဲ့ေနရာမွာ ကိုယ္ႀကိဳက္တာထည့္ပါ။
'Node 1' , 'Node 1.1' စသည့္ေနရာမွာ လင့္အတြက္ ေပၚေစခ်င္တဲ့ စာထည့္ပါ...
'link.html' ဆိုတာကေတာ့ Link URL ပါ...
d.add( -ေနာက္က ပထမနံပါတ္မွာ 1 ကေနစၿပီး ကိုယ္ထည့္သေလာက္အဆံုးထိ အစဥ္လိုက္ 1-10,etc... ျဖစ္သြားရပါမယ္... 100 ေက်ာ္ထည့္ရင္ 100 ေက်ာ္ထိ အစဥ္လိုက္ျဖစ္သြားပါမယ္...
ဥပမာ...
d.add(0,
d.add(1,
d.add(2,
--------
d.add(100,
d.add( -ေနာက္က ဒုတိယနံပါတ္မွာ မိမိ Sub Tree Menu စခြဲခ်င္တဲ့ ေနရာမွ... ေရာက္ေနတဲ့ ပထမနံပါတ္ျဖစ္ရပါမယ္...
ဥပမာ...
Node 1.1 သည္ Node 1 ရဲ ့ ေအာက္မွာ ရွိေစခ်င္တဲ့အတြက္..
d.add(2,1,'Node 1.1','link.html'); ဟုေရးပါသည္...
2 ဆိုသည့္ ပထမနံပါတ္မွာ အစဥ္လိုက္ ေရာက္ရွိရာ ဂဏန္းျဖစ္ပါသည္...
1 ဆိုသည့္ ဒုတိယနံပါတ္မွာ Node 1.1 ကို Node 1 ရဲ ့ေအာက္မွာ ရွိေစခ်င္တဲ့အတြက္ Node 1 ရဲ ့ ပထမဂဏန္းကို ယူပါသည္...
ေပးထားတဲ ့ Code နဲ ့ ပံုေလးေတြ ကိုေသခ်ာၾကည့္ရင္ သေဘာေပါက္မယ္ ထင္ပါတယ္...
ေပ်ာ္ရႊင္စြာ ဘေလာ့ဂ္ဂင္း ႏိုင္ၾကပါေစဗ်ာ...
ဒီပို ့စ္ေလးကို ပရင့္ထုတ္မယ္
No comments:
Post a Comment