​လွ​ပ​တဲ့ Sliding JavaScript Side Bar Menu ​ေလး​ထည့္​နည္း​ပါ။

 ​သည္​ေန႔​တင္​လိုက္​တဲ့​နည္း​ပ​ညာ​ေလး​က​ေတာ့  ​ဘ​ေလာ့​ရဲ့ ​ဆိုဒ္​ဘား​ေဘး​က​ေန  slider ​ပံု​စံ
​ေလး​နဲ႔ ​ထြက္​လာ​မဲ့ ​နည္း​ေလး​ပါ...​သူ​က​ေတာ့ ​မိ​မိ​တို႔ ​ၫြွန္း​လို​တဲ့ ​ဘ​ေလာ့​ေတြ​ကို ​ထည့္​ထား​ႏိုင္​ပါ​တယ္... ​ေနာက္ ​တ​ျခား​မည္​သည့္​လင့္​ေတြ ​ေန​ရာ​ေတြ​မ​ဆို ​အဲ​ထဲ​မွာ ​ထည့္​ၿပီး ​လမ္း​ျပ​ေပး​ႏိုင္​ပါ​တယ္...​ေနာ္  ​စမ္း​ၾကည့္​လိုက္​ပါ...


Step 1.   ​အ​ေန​နဲ႔  ​ေအာက္​က​ပံု​ေလး​ေတြ​အ​တိုင္း​ေပါ့ ​သြား​လိုက္​ပါ...

    ►1.  Login ​လုပ္​လိုက္​ပါ ​ဘ​ေလာ့​ကာ​ကို
   ►2.  Layout ​ကို​က​လစ္​ရ​ပါ့​မယ္ ​မိ​မိ​တို႔  Dashboard ​က​ေန​ေပါ့
   ►3.  Add a Gadget ​ကို​က​လစ္​ေပး​လိုက္​ပါ
   ►4.  HTML/Javascript. ​ကို​က​လစ္​ၿပီး ​က်​လာ​တဲ့ ​ေဘာက္​ေလး​ထဲ​မွာ​ဘဲ
   ►5.  ​ေအာက္​က​ေပး​ထား​တဲ့ ​ကုဒ္​ေတြ​ကို ​ေကာ္​ပီ​ယူ ​ထည့္​လိုက္​ပါ
                 ( ​မ​ရွင္း​ပါ​က ​ပံု​ေလး​ေတြ ​ၾကည့္​လုပ္​ပါ  )

Step 2.  ​အ​ေပၚ​ပံု​မွာ​ျမင္​ေန​တဲ့ ​ေန​ရာ​ေရာက္​တာ​နဲ႔  Add a Gadget ​ဆို​တာ​ကို​က​လစ္​ေပး​လိုက္​ပါ။

Step 3. ​ေနာက္​တ​ဆင့္​ေအ​န​နဲ႔  ​အ​ေပၚ​က​လို ​ဇ​ယား​ေလး​က်​လာ​တာ​နဲ႔ ​အ​ေပၚ​ပံု​ျပ​ထား​တဲ့ ​အ​တိုင္း
             HTML/JavaScript  ​ဆို​တာ​ကို​ရွာ​ၿပီး​က​လစ္​ေပး​လိုက္​ပါ။

Step 4. ​အဲ​ခ်ိန္​မွာ ​ေဘာက္​ေလး​တစ္​ခု ​က်​လာ​မယ္.. ​အဲ​ထဲ​မွာ​ဘဲ ​ေအာက္​က ​ကုဒ္​ေတြ​ကို ​ေကာ္​ပီ​ယူ ​ထည့္
             ​ေပး​လိုက္​ပါ​ေတာ့.........

<script src="http://safir85.ucoz.com/bdlab-blogspot/24work/side-bar-menu/prototype.js" type="text/javascript"></script><script src="http://safir85.ucoz.com/bdlab-blogspot/24work/side-bar-menu/effects.js" type="text/javascript"></script><script src="http://safir85.ucoz.com/bdlab-blogspot/24work/side-bar-menu/side-bar.js" type="text/javascript"></script><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Grab this"><img src="https://bitly.com/24workpng" alt="Blogger Tips And Tricks|Latest Tips For Bloggers" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Free Backlinks"><img src="https://bitly.com/24workpng" alt="Free Backlinks" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Free"><img src="https://bitly.com/24workpng" alt="Blogger Tips And Tricks" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><style>body{ font-size:75%; } a{ outline: none; } a:active{ outline: none; } #sideBar{ text-align:left; } #sideBar h2{ color:#F0FFFF; font-size:110%; font-family:arial; margin:10px 10px 10px 10px; font-weight:bold !important; } #sideBar h2 span{ font-size:125%; font-weight:normal !important; } #sideBar ul{ margin:0px 0px 0px 0px; padding:0px 0px 0px 0px; } #sideBar li{ margin:0px 5px 5px 10px; padding: 0 0 0 10px; list-style-type:none; display:block; background-color:#DA1074; width:177px; color:#FFFFFF; } #sideBar li a{ width:100%; } #sideBar li a:link, #sideBar li a:visited{ color:#FFFFFF; font-family:verdana; font-size:100%; text-decoration:none; display:block; margin:0px 0px 0px 0px; padding:0 0 0 20px; width:100%; } #sideBar li a:hover{ color:#FFFF00; text-decoration:underline; } #sideBar{ position: fixed; width: auto; height: auto; top: 140px; left:0px; background-image:url(http://2.bp.blogspot.com/-nUGCKbZIyb4/Tvq4n0Ix8CI/AAAAAAAAACk/cPMmEKDYqto/s320/left.collapse.border.png); background-position:top right; background-repeat:repeat-y; } #sideBarTab{ float:left; height:137px; width:28px; } #sideBarTab img{ border:0px solid #FFFFFF; } #sideBarContents{ float:left; overflow:hidden !important; width:200px; height:320px; } #sideBarContentsInner{ width:200px; }</style><div id="sideBar"><div id="sideBarContents" style="display:none;"><div id="sideBarContentsInner"><h2>Left<span>Menu</span></h2><ul><li><a href="#">Link One</a></li><li><a href="#">Link Two</a></li><li><a href="#">Link Three</a></li><li><a href="#">Link Four</a></li></ul></div></div><a id="sideBarTab" href="#"><img alt="sideBar" src="http://1.bp.blogspot.com/-gPACiBoLjnI/TxPJ-2PsgfI/AAAAAAAAAIw/mQGIlkBHf_4/s320/sidebarcollapse.png" title="sideBar" /></a></div>

                                                                  ​ထည့္​ၿပီး​တာ​နဲ႔ Save  
​မွတ္​ခ်က္     ။            ။
============
 <li><a href="#">Link One</a></li>
<li><a href="#">Link Two</a></li>
<li><a href="#">Link Three</a></li>
<li><a href="#">Link Four</a></li>
             ​သည္​လင့္​ေတြ​မွာ ​မိ​မိ​တို႔​လို​ျခင္​တာ ​ၫြွန္း​ျခင္​တာ​ကို ​ထည့္​ေပး​ရ​ပါ​မယ္....​ဥ​ပ​မာ
 

  <li><a href="http://aungsanmks.blogspot.com/">​ဘ​ေလာ့​ခ​ရီး​သည္</a></li>
 ​သည္​လို​ေလး​ေပါ့... #  ​ေန​ရာ​မွာ ​မိ​မိ​ရဲ့ ​ၫြွန္း​လို​တဲ့ ​လင့္​ေပါ့​ဗ်ာ.. ​ေနာက္​က​ေတာ့  ​ၫြွန္း​တဲ့ ​ဆိုဒ္ ​အ​မည္..
​ဆိုဒ္​ကို​မွ ​မ​ဟုတ္​ဘူး​ေနာ္ ​ဘယ္​ေန​ရာ​ကို​မ​ဆို ​ၫြွန္​ျပ​ႏိုင္​ပါ​တယ္... ​လို​အပ္​ပါ​က ​လင့္​ေတြ​ကို ​ထပ္​ၿပီး ​ပြား​ႏိုင္​ပါ​ေသး​တယ္​ေနာ္.... ​အဲ​တိုင္း​ေကာ္​ပီ​ယူ ​ေအာက္​က​ေန ​လို​သ​လို​ပြား​ေစ​ဗ်ာ......
​အ​ဆင္​ေျပ​ပါ​ေစ​လို႔ ​ဆု​ော​တင္း​လ်ွက္..........

 ​ထည့္​ၿပီး​တာ​နဲ႔ Save

​အား​ေပး​ေန​ၾက​တဲ့​အ​တြက္ ​ေက်း​ဇူး​အ​ထူး​တင္​ပါ​တယ္.. ​တုန္႔​ျပန္​မႈ​အ​ေန​နဲ႔ fb like ​ေလး​ေတာ့ ​လုပ္​ေပး​ခဲ့​ၾက​ပါ​ေနာ္.. ​တတ္​စြမ္း​သ​မ်ွ ​ေတြ႕ ​ရွိ​သ​ေမ်ွ​လး​ေတြ​ကို ​ျပန္​လည္ ​ေမ်ွ​ဝ​ေန​ပါ့​မယ္...။ ​အ​ဆင္​မ​ေျပ​တာ​မ်ား​ရွိ​ခဲ့​ပါ​က...cbox ​မွာ ​ေျပာ​ခဲ့​ၾက​ပါ​ေနာ္..

<<<​မန္​ဘာ​ဝင္​ၿပီး...Fb Like ​ျခင္း​ျဖင့္ ​အား​ေပး​ၾက​ပါ​ေနာ္>>>

​ေအာင္​ေအာင္(​မ​က​စ) ​ပိုင္​ဆိုင္​ေသာ ​ေန​ရာ​ေလး​မ်ား​ကို​လာ​လည္​ၾက​ပါ။

​ဘ​ေလာ့​ခ​ရီး​သည္