Easy Menu For Your Blog

ဘေလာ့ဆိုတဲ့ နယ္ေျမထဲမွ၀င္ေရာက္စ သူငယ္ခ်င္းေတြအတြက္ အဆင္ေျပေခ်ေမြ႕႔ေစတဲ့ Menu အလြယ္ကူဆုံးထည့္နည္းေလးပါ... ဒါေလးကေတာ့ ဘယ္ html ေတြ ဘာေတြမွလဲ ၀င္စရာမလိုေတာ့ပါဘူး  မိမိဘေလာ့ရဲ႕ layout ကေန အလြယ္တကူထည့္နိဳင္မွာ ျဖစ္ပါတယ္..
ကဲ ထည့္နည္းနဲ႕ ကုဒ္ေတြကို ေအာက္မွာ ေပးလို္ကတယ္ေနာ္..အရင္ကလဲ မ်ားစြာ တင္ေပးဘူးပါတယ္.... အလြယ္တကူထည့္နိဳင္တဲ့နည္းလမ္းေတြကိုေပါ့...
ၾကိဳက္တာ ယူသုံးနိဳင္ပါတယ္..

<div id="navcontainer"><ul id="nav"><li class="current-cat"><a href="http://www.akarphyoe.com/">Home</a></li><li><a href="#">ျမန္မာ Ebook မ်ား</a><ul class="children"><li><a href="#"> window 7 အေၾကာင္း</a></li><li><a href="#">စာထည့္</a></li></a></li><li class="current-cat"><a href="#"> စာထည့္</a></li></ul></li>

မွတ္ခ်က္ ။    ။ ပုံက သေဘာျပထားတာပါ အဲတိုင္းမဟုတ္ပါဘူးးးဟိဟိ..
                    #  ေနရာမွာမိမိတို႕ လင့္ကိုထည့္ပါ.... link ခ်ိတ္နည္းမသိပါက   သည္မွာ   ေလ့လာလုိက္ပါ.။

ေအာင္ေအာင္(မကစ) ရဲ႕ ဘေလာ့ခရီးသည္ေလးအား အားေပးေနၾကတဲ့အတြက္ ေက်းဇဴးအထူးတင္ပါတယ္.. တုန္႕ျပန္မွဳအေနနဲ႕ fb like ေလးေတာ့ လုပ္ေပးခဲ့ၾကပါေနာ္.. တတ္စြမ္းသမွ် ေတြ႕ ရွိသမွ်ေလးေတြကို ျပန္လည္ မွ်ေ၀ေနပါ့မယ္...။ အဆင္မေျပတာမ်ားရွိခဲ့ပါက...cbox မွာ ေျပာခဲ့ၾကပါေနာ္..

ဘေလာ့ခရီးသည္သို႕ { ဒီမွာ } သြားလိုက္ပါ
ဘေလာ့ဆုိင္ရာနည္းပညာမ်ား{ ဒီမွာ } သြားလိုက္ပါ
စြယ္စုံစာအုပ္စင္{ ဒီမွာ } သြားလိုက္ပါ

Read More

Dropdown Menu လွလွေလးဖန္တီးၾကမယ္

ခုတင္တဲ့ နည္းလမ္းေလးကေတာ့ ခဏခဏ တင္ေပးထားဘူးတဲ့ dropdown menu ဆိုတဲ့ ေခါင္းစဥ္ လွလွ
နည္းလမ္းေလးတစ္ခုပါဘဲ.. ဒါေပမယ့္ တမ်ိဳးတမ်ိဳးဆီ အဆင္ေျပသလို သုံးစြဲနိဳင္ရန္အတြက္ တင္ျပေပးလုိက္ျခင္းျဖစ္ပါတယ္...
လုပ္နည္းနဲ႕ လိုအပ္တဲ့ ကုဒ္ေတြ ကို ေအာက္မွာဆက္လက္ ေလ့လာလုိက္ပါေနာ္..

►1-  Blogger Singin ၀င္လိုက္ပါ။
►2-  Dashboard  ကိုသြားလိုက္ပါ။
►3-  Template    ကိုကလစ္ပါ..။
►4-  Edit  Html   ကို၀င္ပါ.. Process ကိုကလစ္ျပီးဆက္၀င္လုိက္ပါ။
►5-  Ctrl+F  (သို႕မဟုတ္) F3  အကူညီျဖင့္ ေပးထားတဲ့ ကုဒ္ကို ရွာလိုက္ပါ။


                   ]]></b:skin>    ကုဒ္ကိုရွာလုိက္ပါ ေတြ႕တာနဲ႕ သူ႕အေပၚမွာ သူမတုိင္မွီေပါ့
ေအာက္ကေပးထားတဲ့ကုဒ္ေတြကို ထည့္ေပးလုိက္ပါေနာ္....မေတြ႕ပါက  b:skin  ကိုသာရွာလိုက္ပါ ေတြ႕တာနဲ႕ သူ႕ေရွ႕က မွ်ားနက္ေလးကိုကလစ္ ျဖည္လုိက္ပါ ေနာက္ အန္းတား ေခါက္ပါ လိုျခင္ေသာကုဒ္ ေတြ႕ပါျပီ

/* Flying Css3 menu www.bloggertrix.com*/ #flyingmenubt,#flyingmenubt ul { list-style: none outside none; margin: 0; padding: 0; height:500px;} #flyingmenubt { font-family: "Lucida Sans Unicode",Verdana,Arial,sans-serif; font-size: 13px; height: 36px; list-style: none outside none; margin: 40px auto; text-shadow: 0 -1px 3px #202020; width: 980px; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px; -moz-box-shadow: 0px 3px 3px #cecece; -webkit-box-shadow: 0px 3px 3px #cecece; box-shadow: 0 3px 4px #8b8b8b; background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #787878), color-stop(0.5, #5E5E5E), color-stop(0.51, #707070), color-stop(1, #838383)); background-image: -moz-linear-gradient(center bottom, #787878 0%, #5E5E5E 50%, #707070 51%, #838383 100%); background-color:#5f5f5f; } #flyingmenubt ul { left: -9999px; position: absolute; top: -9999px; z-index: 2; } #flyingmenubt li { border-bottom: 1px solid #575757; border-left: 1px solid #929292; border-right: 1px solid #5d5d5d; border-top: 1px solid #797979; display: block; float: left; height: 34px; position: relative; width: 105px; } #flyingmenubt li:first-child { border-left: 0 none; margin-left: 5px; } #flyingmenubt li a { color: #FFFFFF; display: block; line-height: 34px; outline: medium none; text-align: center; text-decoration: none; background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #787878), color-stop(0.5, #5E5E5E), color-stop(0.51, #707070), color-stop(1, #838383)); background-image: -moz-linear-gradient(center bottom, #787878 0%, #5E5E5E 50%, #707070 51%, #838383 100%); background-color:#5f5f5f; } /* keyframes #animation1 */ @-webkit-keyframes animation1 { 0% {-webkit-transform: scale(1);} 30% {-webkit-transform: scale(1.3);} 100% {-webkit-transform: scale(1);}} @-moz-keyframes animation1 { 0% {-moz-transform: scale(1);} 30% {-moz-transform: scale(1.3);} 100% {-moz-transform: scale(1);}} #flyingmenubt li > a:hover { -moz-animation-name: animation1; -moz-animation-duration: 0.7s; -moz-animation-timing-function: linear; -moz-animation-iteration-count: infinite; -moz-animation-direction: normal; -moz-animation-delay: 0; -moz-animation-play-state: running; -moz-animation-fill-mode: forwards; -webkit-animation-name: animation1; -webkit-animation-duration: 0.7s; -webkit-animation-timing-function: linear; -webkit-animation-iteration-count: infinite; -webkit-animation-direction: normal; -webkit-animation-delay: 0; -webkit-animation-play-state: running; -webkit-animation-fill-mode: forwards; } #flyingmenubt li:hover > a { z-index: 4; } #flyingmenubt li:hover ul.subs { left: 0; top: 34px; width: 150px; } #flyingmenubt ul li { background: none repeat scroll 0 0 #838383; box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5); opacity: 0; width: 100%; /*-webkit-transition:all 0.3s ease-in-out; -moz-transition:all 0.3s ease-in-out; -o-transition:all 0.3s ease-in-out; -ms-transition:all 0.3s ease-in-out; transition:all 0.3s ease-in-out;*/ } /* keyframes #animation2 */ @-webkit-keyframes animation2 { 0% {margin-left:185px;} 100% {margin-left:0px;opacity:1;} } @-moz-keyframes animation2 { 0% {margin-left:185px;} 100% { margin-left:0px;opacity:1;} } #flyingmenubt li:hover ul li { /* css3 animation */ -moz-animation-name: animation2; -moz-animation-duration: 0.3s; -moz-animation-timing-function: linear; -moz-animation-iteration-count: 1; -moz-animation-direction: normal; -moz-animation-delay: 0; -moz-animation-play-state: running; -moz-animation-fill-mode: forwards; -webkit-animation-name: animation2; -webkit-animation-duration: 0.3s; -webkit-animation-timing-function: linear; -webkit-animation-iteration-count: 1; -webkit-animation-direction: normal; -webkit-animation-delay: 0; -webkit-animation-play-state: running; -webkit-animation-fill-mode: forwards; /*-webkit-transition:all 0.3s ease-in-out; -moz-transition:all 0.3s ease-in-out; -o-transition:all 0.3s ease-in-out; -ms-transition:all 0.3s ease-in-out; transition:all 0.3s ease-in-out;*/ } /* animation delays */ #flyingmenubt li:hover ul li:nth-child(1) { -moz-animation-delay: 0; -webkit-animation-delay: 0; } #flyingmenubt li:hover ul li:nth-child(2) { -moz-animation-delay: 0.05s; -webkit-animation-delay: 0.05s; } #flyingmenubt li:hover ul li:nth-child(3) { -moz-animation-delay: 0.1s; -webkit-animation-delay: 0.1s; } #flyingmenubt li:hover ul li:nth-child(4) { -moz-animation-delay: 0.15s; -webkit-animation-delay: 0.15s; } #flyingmenubt li:hover ul li:nth-child(5) { -moz-animation-delay: 0.2s; -webkit-animation-delay: 0.2s; } #flyingmenubt li:hover ul li:nth-child(6) { -moz-animation-delay: 0.25s; -webkit-animation-delay: 0.25s; } #flyingmenubt li:hover ul li:nth-child(7) { -moz-animation-delay: 0.3s; -webkit-animation-delay: 0.3s; } #flyingmenubt li:hover ul li:nth-child(8) { -moz-animation-delay: 0.35s; -webkit-animation-delay: 0.35s; }

ေနာက္  save template လုပ္နိဳင္ပါတယ္...
ျပီးတာနဲ႕ ေနာက္တဆင့္ ထပ္လုပ္ဖို႕ က်န္ပါေသးးတယ္  ေအာက္မွာ ဆက္ေလ့လာပါေနာ္

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

<ul id="flyingmenubt">
    <li><a href="http://www.bloggertrix.com/">Home</a></li>
    <li><a class="hsubs" href="#">Menu 1</a>
        <ul class="subs">
            <li><a href="#">Submenu 1</a></li>
            <li><a href="#">Submenu 2</a></li>
            <li><a href="#">Submenu 3</a></li>
            <li><a href="#">Submenu 4</a></li>
            <li><a href="#">Submenu 5</a></li>
        </ul>
    </li>
    <li><a class="hsubs" href="http://www.bloggertrix.com/">Menu 2</a>
        <ul class="subs">
            <li><a href="#">Submenu 2-1</a></li>
            <li><a href="#">Submenu 2-2</a></li>
            <li><a href="#">Submenu 2-3</a></li>
            <li><a href="#">Submenu 2-4</a></li>
            <li><a href="#">Submenu 2-5</a></li>
            <li><a href="#">Submenu 2-6</a></li>
            <li><a href="#">Submenu 2-7</a></li>
            <li><a href="#">Submenu 2-8</a></li>
        </ul>
    </li>
    <li><a class="hsubs" href="#">Menu 3</a>
        <ul class="subs">
            <li><a href="#">Submenu 3-1</a></li>
            <li><a href="#">Submenu 3-2</a></li>
            <li><a href="#">Submenu 3-3</a></li>
            <li><a href="#">Submenu 3-4</a></li>
            <li><a href="#">Submenu 3-5</a></li>
        </ul>
    </li>
    <li><a href="#">Menu 4</a></li>
    <li><a href="#">Menu 5</a></li>
    <li><a href="#">Menu 6</a></li>
    <li><a href="http://www.bloggertrix.com/">Back</a></li>
</ul>

   ကဲဒါဆို အဆင္ျပသေလာက္ပါျပီေနာ္... လုိအပ္သေလာက္ ေခါင္းစဥ္ေတြကိုလဲ ပြါးနိဳင္ပါတယ္..

ေအာင္ေအာင္(မကစ) ရဲ႕ ဘေလာ့ခရီးသည္ေလးအား အားေပးေနၾကတဲ့အတြက္ ေက်းဇဴးအထူးတင္ပါတယ္.. တုန္႕ျပန္မွဳအေနနဲ႕ fb like ေလးေတာ့ လုပ္ေပးခဲ့ၾကပါေနာ္.. တတ္စြမ္းသမွ် ေတြ႕ ရွိသမွ်ေလးေတြကို ျပန္လည္ မွ်ေ၀ေနပါ့မယ္...။ အဆင္မေျပတာမ်ားရွိခဲ့ပါက...cbox မွာ ေျပာခဲ့ၾကပါေနာ္..

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

ဘေလာ့ခရီးသည္သို႕ { ဒီမွာ } သြားလိုက္ပါ
ဘေလာ့ဆုိင္ရာနည္းပညာမ်ား{ ဒီမွာ } သြားလိုက္ပါ
စြယ္စုံစာအုပ္စင္{ ဒီမွာ } သြားလိုက္ပါ

Read More

ဘေလာ့မွာ Horizontal Menu ( အလြယ္ထည့္သုံးနိဳင္ )

ဒီပုိ့စ္ေလးကေတာ့ Horizontal Menu ေလးေပါ့ေနာ္။သုံးခ်င္တဲ့မိတ္ေဆြေတြအတြက္
တင္ေပးလုိက္ပါတယ္ဗ်ာ။ cond ေလးကအရမ္းေပးလြယ္ပါတယ္။ႀကဳိက္ရင္ယူသုံးလိုက္ပါေနာ္...
ေအာက္မွာ လုပ္နည္းနဲ႕  ကုဒ္ေတြေပးထားပါတယ္..

ေအာက္က နမွူနာ အတုိင္ျမင္ရမွာပါ

Home Photos Videos Misic download Links Windown 7 Sign In

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

<table align="center"><tr><td><table align="center" border=1 cellpadding=7><tr><td><a href="မိမိဘေလာ့ လိပ္စာထည့္ပါ">Home</a> </td><td><a href="မိမိဘေလာ့ လိပ္စာထည့္ပါ">Photos </a> </td><td><a href="မိမိဘေလာ့ လိပ္စာထည့္ပါ">Videos </a> </td><td><a href="မိမိဘေလာ့ လိပ္စာထည့္ပါ">Misic</a> </td><td><a href="မိမိဘေလာ့ လိပ္စာထည့္ပါ">download</a> </td><td><a href="မိမိဘေလာ့ လိပ္စာထည့္ပါ">Links</a> </td><td><a href="မိမိဘေလာ့ လိပ္စာထည့္ပါ">Windown 7</a> </td><td><a href="မိမိဘေလာ့ လိပ္စာထည့္ပါ">Sign In</a> </td></tr></table></td></tr></table>

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

 
ဘေလာ့ခရီးသည္သို႕ { ဒီမွာ } သြားလိုက္ပါ
ဘေလာ့ဆုိင္ရာနည္းပညာမ်ား{ ဒီမွာ } သြားလိုက္ပါ
စြယ္စုံစာအုပ္စင္{ ဒီမွာ } သြားလိုက္ပါ

Read More

မိမိရ႕ဘေလာ႕linkေတြကိုscrolling နွင့္လုပ္ခ်င္ရင္ လုပ္ခ်င္ရင္

ဒီေန႔က်ေနာ္တင္တဲ့ code ကလည္းဘေလာ့ဂါအတြက္အရမ္းကို သံုးလည္းသံုးေပ်ာ္သလို အသံုးလည္းဝင္ပါတယ္၊တစ္ခ်ိဳ႕ကေတာ့သိၿပီးၾကမွာပါ မသိၾကေသးတဲ့ခ်စ္မိတ္ေဆြသူငယ္ခ်င္းေတြအတြက္ပါ၊၊ တျခားcodeေတြလည္းက်ေနာ္ေတြ႕ဘူးပါတယ္ ဒီcodeေလးကအရမ္းရွင္းလို႕တင္လိုက္ျခင္းပါဘဲ၊

ေအာက္မွာပုံႏွင့္တကြ code

• ဤေနရာတြင္အမည္ထည့္ပါ
• ဤေနရာတြင္အမည္ထည့္ပါ
• ဤေနရာတြင္အမည္ထည့္ပါ
• ဤေနရာတြင္အမည္ထည့္ပါ
• ဤေနရာတြင္အမည္ထည့္ပါ
• ဤေနရာတြင္အမည္ထည့္ပါ
• ဤေနရာတြင္အမည္ထည့္ပါ
• ဤေနရာတြင္အမည္ထည့္ပါ
• ဤေနရာတြင္အမည္ထည့္ပါ
• ဤေနရာတြင္အမည္ထည့္ပါ
• ဤေနရာတြင္အမည္ထည့္ပါ
• ဤေနရာတြင္အမည္ထည့္ပါ
• ဤေနရာတြင္အမည္ထည့္ပါ
• ဤေနရာတြင္အမည္ထည့္ပါ
• ဤေနရာတြင္အမည္ထည့္ပါ
• ဤေနရာတြင္အမည္ထည့္ပါ
• ဤေနရာတြင္အမည္ထည့္ပါ
• ဤေနရာတြင္အမည္ထည့္ပါ
• ဤေနရာတြင္အမည္ထည့္ပါ
• ဤေနရာတြင္အမည္ထည့္ပါ
• ဤေနရာတြင္အမည္ထည့္ပါ
• ဤေနရာတြင္အမည္ထည့္ပါ
• ဤေနရာတြင္အမည္ထည့္ပါ
• ဤေနရာတြင္အမည္ထည့္ပါ

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

<div class="widget-content">
<ul style="height:150px;width:150px; overflow:auto; ">

<li><a href="ဤေနရာတြင္linkထည့္ပါ  "> ဤေနရာတြင္အမည္ထည့္ပါ </a></li>
<li><a href="ဤေနရာတြင္linkထည့္ပါ  "> ဤေနရာတြင္အမည္ထည့္ပါ </a></li>
<li><a href="ဤေနရာတြင္linkထည့္ပါ  "> ဤေနရာတြင္အမည္ထည့္ပါ </a></li>
<li><a href="ဤေနရာတြင္linkထည့္ပါ  "> ဤေနရာတြင္အမည္ထည့္ပါ </a></li>
<li><a href="ဤေနရာတြင္linkထည့္ပါ  "> ဤေနရာတြင္အမည္ထည့္ပါ </a></li>
<li><a href="ဤေနရာတြင္linkထည့္ပါ  "> ဤေနရာတြင္အမည္ထည့္ပါ </a></li>
<li><a href="ဤေနရာတြင္linkထည့္ပါ  "> ဤေနရာတြင္အမည္ထည့္ပါ </a></li>
<li><a href="ဤေနရာတြင္linkထည့္ပါ  "> ဤေနရာတြင္အမည္ထည့္ပါ </a></li>
<li><a href="ဤေနရာတြင္linkထည့္ပါ  "> ဤေနရာတြင္အမည္ထည့္ပါ </a></li>
<li><a href="ဤေနရာတြင္linkထည့္ပါ  "> ဤေနရာတြင္အမည္ထည့္ပါ </a></li>
<li><a href="ဤေနရာတြင္linkထည့္ပါ  "> ဤေနရာတြင္အမည္ထည့္ပါ </a></li>
<li><a href="ဤေနရာတြင္linkထည့္ပါ  "> ဤေနရာတြင္အမည္ထည့္ပါ </a></li>
<li><a href="ဤေနရာတြင္linkထည့္ပါ  "> ဤေနရာတြင္အမည္ထည့္ပါ </a></li>
<li><a href="ဤေနရာတြင္linkထည့္ပါ  "> ဤေနရာတြင္အမည္ထည့္ပါ </a></li>
<li><a href="ဤေနရာတြင္linkထည့္ပါ  "> ဤေနရာတြင္အမည္ထည့္ပါ </a></li>
<li><a href="ဤေနရာတြင္linkထည့္ပါ  "> ဤေနရာတြင္အမည္ထည့္ပါ </a></li>
<li><a href="ဤေနရာတြင္linkထည့္ပါ  "> ဤေနရာတြင္အမည္ထည့္ပါ </a></li>
<li><a href="ဤေနရာတြင္linkထည့္ပါ  "> ဤေနရာတြင္အမည္ထည့္ပါ </a></li>
<li><a href="ဤေနရာတြင္linkထည့္ပါ  "> ဤေနရာတြင္အမည္ထည့္ပါ </a></li>
<li><a href="ဤေနရာတြင္linkထည့္ပါ  m"> ဤေနရာတြင္အမည္ထည့္ပါ </a></li>
<li><a href="ဤေနရာတြင္linkထည့္ပါ  "> ဤေနရာတြင္အမည္ထည့္ပါ </a></li>
<li><a href="ဤေနရာတြင္linkထည့္ပါ  "> ဤေနရာတြင္အမည္ထည့္ပါ </a></li>
<li><a href="ဤေနရာတြင္linkထည့္ပါ  "> ဤေနရာတြင္အမည္ထည့္ပါ </a></li>
<li><a href="ဤေနရာတြင္linkထည့္ပါ  "> ဤေနရာတြင္အမည္ထည့္ပါ </a></li><span style="font-weight:bold;"></span>

</ul></div>

မွတ္ခ်က္-မိမိစိတ္တိုင္းsizeေျပာင္းလို႔ရပါတယ္။မိမိတို႕ေခါင္းစဥ္လင့္ခ်ိတ္ပါ   ေခါင္းစဥ္အမည္ ထည့္ပါ....
             ဒါဆို လွပေသသပ္တဲ့ ဘားေလးနဲ႕ မယ္ညဳေတြကို ရပါျပီ....

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

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

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

ဘေလာ့ခရီးသည္သို႕ { ဒီမွာ } သြားလိုက္ပါ
ဘေလာ့ဆုိင္ရာနည္းပညာမ်ား{ ဒီမွာ } သြားလိုက္ပါ
စြယ္စုံစာအုပ္စင္{ ဒီမွာ } သြားလိုက္ပါ

Read More

Sidebar Menu Style လွလွေလးလာျပီေနာ္... ( လန္းမွလန္း )

ကဲ ဘေလာ့ကာ မိတ္ေဆြတို႕ေရ  သည္နည္းေလးကေတာ့  ခပ္လန္းလန္းေလးေပါ့ဗ်ာ... ဘေလာ့မွာ

မ်ားေသာအားျဖင့္ေတာ့ Menu   ေတြကို Dropdown   ေတြႏွစ္သက္ၾကပါတယ္.... အဲတာကိုလည္း

ဘေလာ့ရဲ႕ အေပၚဘားမွာ ထားေလ့ရွိၾကပါတယ္... ပုံမွန္ေအနထားလို႕ဆိုရမယ္ေပါ့...

သည္တစ္ခါေတာ့  က်ေနာ္ တင္တဲ့နည္းလမ္းေလးကေတာ့  Sidebar Dropdown ေလးေနာ္

လန္းေတာ့လန္းတယ္..သူကလည္းး တမ်ိဳးခ်စ္စရာေလးေပါ့..အေပၚမထားျခင္တဲ့ ေဘာ္ဒါမ်ားအတြက္  ေဘးကေန  ထားလို႕ရတာေပါ့...ကဲ

ေအာက္မွာ လုပ္နည္းေတြ  ကုဒ္ေတြ  ေလ့လာ ယူေဆာင္ၾကပါစို႕.....

►1-  Blogger Singin ၀င္လိုက္ပါ။
►2-  Dashboard  ကိုသြားလိုက္ပါ။
►3-  Template    ကိုကလစ္ပါ..။
►4-  Edit  Html   ကို၀င္ပါ..
►5- Ctrl+F  (သို႕မဟုတ္) F3  အကူညီျဖင့္ ေပးထားတဲ့ ကုဒ္ကို ရွာလိုက္ပါ။

]]></b:skin>  ကုဒ္ကို ရွာပါ  ေတြ႕တာနဲ႕ သူ႕အေပၚကပ္လွ်က္  ေပးထားေသာကုဒး္ေတြ ယူထည့္ေပးလိုက္ပါေနာ္...။

post-image /* The CSS Code for the menu starts here s2free.blogspot.com */ #nav12,#nav ul { background-color: #8899AA; list-style: none outside none; margin: 0; padding: 0; } #nav12 { display: block; padding: 5px; position: relative; width: 112px; -moz-perspective: 200px; -ms-perspective: 200px; -webkit-perspective: 200px; -o-perspective: 200px; perspective: 200px; } #nav12 ul { left: -9999px; opacity:0; overflow: hidden; padding: 5px; position: absolute; top: -9999px; -moz-transform: rotateY(70deg); -ms-transform: rotateY(70deg); -o-transform: rotateY(70deg); -webkit-transform: rotateY(70deg); transform: rotateY(70deg); -moz-transform-origin: 0 0; -ms-transform-origin: 0 0; -o-transform-origin: 0 0; -webkit-transform-origin: 0 0; transform-origin: 0 0; -moz-transition: -moz-transform 0.3s linear, opacity 0.3s linear; -ms-transition: -ms-transform 0.3s linear, opacity 0.3s linear; -o-transition: -o-transform 0.3s linear, opacity 0.3s linear; -webkit-transition: -webkit-transform 0.3s linear, opacity 0.3s linear; transition: transform 0.3s linear, opacity 0.3s linear; } #nav12 li { background-color: #FFFFFF; position: relative; } #nav12 > li { -moz-transform-style: preserve-3d; -ms-transform-style: preserve-3d; -o-transform-style: preserve-3d; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; } #nav12 li a { background-color: #AABBCC; border-color: #DDDDDD #555555 #555555 #DDDDDD; border-style: solid; border-width: 1px; color: #000000; display: block; font-size: 15px; padding: 8px 10px 8px 5px; text-decoration: none; width:95px; -moz-transition: all 0.2s linear; -ms-transition: all 0.2s linear; -o-transition: all 0.2s linear; -webkit-transition: all 0.2s linear; transition: all 0.2s linear; } #nav12 li:hover > a { background-color: #8899AA; border-color: #8899AA; color: #FFFFFF; } #nav12 li:hover ul.subs { left: 114px; opacity:1; top: 0; -moz-transition-delay: 0.3s; -ms-transition-delay: 0.3s; -o-transition-delay: 0.3s; -webkit-transition-delay: 0.3s; transition-delay: 0.3s; -moz-transform: rotateY(0deg); -ms-transform: rotateY(0deg); -o-transform: rotateY(0deg); -webkit-transform: rotateY(0deg); transform: rotateY(0deg); } #nav12 ul li { width: 100%; }

အိုေက  မိမိတို႕ တက္ပလက္ကို ေဆ့လုိက္ပါေတာေ့နာ္.....

ေနာက္တဆင့္အေနနဲ႕..........

Sing In Blogger....

Layout    ကို၀င္လိုက္ပါ..ေနာက္...  Add a Gadget  ကိုကလစ္ေပးလိုက္ပါ

အဲမွာဘဲ   Html/Java script  ဆိုတာေတြ႕မယ္.. ရွာလိုက္ပါ.... ေတြ႕တာနဲ႕....

အဲထဲကို   ေအာက္ကကုဒ္ေတြ ထည့္ေပးလိုက္ပါေတာ့.....ဗ်ာ...လန္းးမွလန္းးသြားးမယ္...ေိေိ

.  ေအာက္မွာ ေပးထားေသာကုဒ္မ်ားေကာ္ပီယူ ထည့္လိုက္ပါ

<div class="container">
    <ul id="nav12">
        <li><a href="http://www.s2free.blogspot.com/">Home</a></li>
        <li><a href="#">Menu 1</a>
            <ul class="subs">
                <li><a href="#">Submenu 1</a></li>
                <li><a href="#">Submenu 2</a></li>
                <li><a href="#">Submenu 3</a></li>
                <li><a href="#">Submenu 4</a></li>
                <li><a href="#">Submenu 5</a></li>
            </ul>
        </li>
        <li><a href="#">Menu 2</a>
            <ul class="subs">
                <li><a href="#">Submenu 2-1</a></li>
                <li><a href="#">Submenu 2-2</a></li>
                <li><a href="#">Submenu 2-3</a></li>
                <li><a href="#">Submenu 2-4</a></li>
                <li><a href="#">Submenu 2-5</a></li>
                <li><a href="#">Submenu 2-6</a></li>
                <li><a href="#">Submenu 2-7</a></li>
                <li><a href="#">Submenu 2-8</a></li>
            </ul>
        </li>
        <li><a href="#">Menu 3</a>
            <ul class="subs">
                <li><a href="#">Submenu 3-1</a></li>
                <li><a href="#">Submenu 3-2</a></li>
                <li><a href="#">Submenu 3-3</a></li>
                <li><a href="#">Submenu 3-4</a></li>
                <li><a href="#">Submenu 3-5</a></li>
            </ul>
        </li>
        <li><a href="#">Menu 4</a></li>
        <li><a href="#">Menu 5</a></li>
        <li><a href="#">Menu 6</a></li>
        <li><a href="http://www.s2free.blogspot.com/">Add This</a></li>
    </ul>
</div>

  မွတ္ခ်က္    ။     ။ ေခါင္းစဥ္ေတြကို  မိိမိတို႕ လိုအပ္သလို  ထပ္တိုးနိဳင္ပါတယ္.... မ်ားျခင္သေလာက္ မ်ားနိဳင္တယ္... အဓိက  <li><a href="#">Menu 6</a></li>   ဒါေလးဘဲ ေပါ့...

မိမိတို႕ ေခါင္းစဥ္ေတြ ထဲမွာ....ေတြကေနတဲ့   #  ေနရာကေတာ့  ေခါင္းစဥ္ရဲ႕  Link  ကိုထည့္ရမွာပါ။
Menu  ေတြ   Submenu   ေတါေနရာမွာေတာ့ မိမိတို႕ ပို႕စ္တင္ထားတဲ့ Labels အမည္ေတြေပါ့...
အဆင္ေျပျပီေနာ္..ဒါဆို.... နမူနာေလးလည္းး ပုံျပထားပါတယ္.. ႏွစ္သက္မယ္ဆို သုံးလိုက္ပါေနာ္..

ခုလိုအားေပးတဲ့အတြက္ အထူးေက်းဇဴးတင္ပါတယ္... လိုအပ္တာမ်ားရွိပါက.. C-Box မွာေျပာခဲ့ၾကနိဳင္ပါတယ္... အတတ္နိဳင္ဆုံး ၾကိဳးစား ကူညီ မွ်ေ၀သြားပါမည္...

ဘေလာ့ခရီးသည္သို႕ { ဒီမွာ } သြားလိုက္ပါ
ဘေလာ့ဆုိင္ရာနည္းပညာမ်ား{ ဒီမွာ } သြားလိုက္ပါ
စြယ္စုံစာအုပ္စင္{ ဒီမွာ } သြားလိုက္ပါ

Read More