ပုံေလးေတြ ေမာက္တင္တာနဲ႕ မီးးလုံးေလးေတြ ထေပၚမယ္

အခုတင္ေပးမယ့္္ ပုိ႔(စ္) ေလးကေတာ့ ဘေလာ့ပုိ႔(စ္)မွာ  HTML/Javascript and Css Codes ေတြကုုိ Mouse Pointer ႏွင့္ ထိလုိက္ရင္ မီးလုံးေလးထြက္လာၿပီး မီးလင္းေနေအာင္ တင္နည္း/ထည့္နည္းေလးပါ။ ဤ နည္းကုိသုံး၍ ဘေလာ့ပုိ႔(စ္)မွာ Cond တင္တဲ့ သူေတြေတာ့ သိပ္မရွိသေလာက္ပါပဲ မႀကဳိက္ၾကတာလာေတာ့ မသိပါ။ ႀကဳိက္တဲ့ မိတ္ေဆြေတြ အတြက္ ေအာက္မွာ Demo သြားၾကည့္နုိင္ရန္ Link ႏွင့္တကြ Cond လည္းေပးထားပါတယ္။

 လုပ္နည္းးေလးကေတာ့ ေအာက္မွာ ၾကည့္လုိက္ပါ....

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

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

.code1 {

overflow:auto;width:503px;height:200px;

font-family: "Consolas", "Courier New", Courier, mono, serif;

color:#848176;

margin : 15px 35px 15px 15px;

padding : 10px 10px 10px 35px;

clear : both;

list-style-type : none;

background : #000000 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjG20Wmu05gS9VBoe-YBCki-7V-jewXAUJbIEXqCf8WOcMdwbjTf1Squok7PnJQ7tQiDdVM_y-EI-jeqtsGym347o5KZE4fXr6R8gjfkxR90D8gIAuCMgLekMYl898omdib6dOSo5g61GnQ/s320/btsnts-show-codes1.jpg) repeat-y top left;

border : 1px solid #000000;

border-left:20px solid #ccc;

-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-o-transition-duration:all .3s ease-in-out;transition:all .3s ease-in-out;-webkit-border-radius:3px;-moz-border--moz-border-radius: 23px 20px 20px 20px;border-radius: 23px 20px 20px

}

.code1:hover{

background : #000000 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEipOFoKNpPQwA1lqniEh2CoeTs_OwgLTaI6ZKtnyfjKUgor424MaALtIcvwpnSMtYvde-lgqJneTRF1jTznYhgyHbPEenYGcp358Gmug0N31-o8RMyFVAr3hQ3B1uRPVxu8mJrdDHUNqteM/s1600/btsnts-show-codes2.jpg) repeat-y top left;

color:#FEF9BF;

border : 1px solid #000;

border-left:20px solid #ccc;

-webkit-box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);

-moz-box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);

box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);

box-shadow: 10px 10px 5px #888888;

}

မိမိတို႕ တက္ပလက္ ေဆ့လို႕ ရပါျပီ...ဒါဆို
ပို႕စ္တင္ၾကမယ္ေပါ့...တင္တဲ့အခါ ကုဒ္ေလးထည့္ေပးလိုက္ပါ...အဲကုဒ္မွာ ဘဲ မိမိတို႕ေပၚေစျခင္တဲ့
လင့္ကို ထည့္ရမွာပါ...ေအာက္မွာပါ..

<div class="code1">
ဒီေနရာမွာ မိမိ ေပၚေစခ်င္တဲ့ HTML/Javascript Codes ကုိထည့္ပါ။  </div>

                  မူရင္းးကို  သည္မွာ  ေလ့လာနိဳင္ပါတယ္..

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

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

လယ္တီေျမသား www.ledimye.blogspot.com

ဘေလာ့ခရီးသည္ http://aungsanmks.com/

ဓမၼႏွင့္စာေပနန္းေတာ္ http://ninilayy.blogspot.com/

ဘေလာ့ခရီးသည္သို႕ { ဒီမွာ } သြားလိုက္ပါ

သခင္သာလွ်င္မွတင္သမွ်ကို fb မွာဖတ္ခ်င္ရင္ ဒီမွာ like ႏွိပ္ပါ

အျပည့္စံုဖတ္ခ်င္ရင္ဒီေနရာေလးေနာ္>>>>

Numbered Page Navigation ေလးေတြ ဘေလာ့မွာ ထည့္ၾကမယ္

 အားလုံးမဂၤလာပါဗ်ာ... ကြ်န္ေတာ္ ခုတင္မဲ့ နည္းပညာေလးကေတာ့ ေဘလာ့တစ္ခုမွာ လုိအပ္ခ်က္ေလး တစ္ခုျဖစ္တဲ့  စာမ်က္ ႏွာ အေရတြက္ နံပါတ္ေလးေတြဘဲ ျဖစ္ပါတယ္... ခဏခဏ လာလာေမးေနၾကလို႕ က်ေနာ္လည္း  အရင္ တင္ထားဘူးပါတယ္... အဲတုန္းကေတာ့ ပုံစံတမ်ိိဳးထဲပဲ  ဗ်... ခုကေတာ့

အဂၤလိပ္ ဆိုဒ္တစ္ခုကို ဘဲ လမ္းညႊန္ရေတာ့မယ္... စတိုင္ေလးေတြ အမ်ိဳးမ်ိဳးနဲ႕ ဆိုေတာ့ ေရြးခ်ယ္ ခြင့္ရတာေပါ့  မိမိတို႕ ႏွစ္သက္ရာ စတိုင္ေလးကိုေရြးခ်ယ္ ျပီး မိမိတို႕ဘေလာ့ ပို႕စ္ေတြရဲ႕ ေအာက္ဆုံးမွာ

နံပါတ္စဥ္ေလး  နဲ႕ျပေနတာေလး ဖန္တီးၾကပါစို႕ေနာ္..........

ကဲ ဒါဆို  ကြ်န္ေတာ္ တကယ္ ျပည့္စုံတဲ့ ေနရာေလးကိုဘဲ လမ္းျပေပးလိုက္ပါေတာ့မယ္ေနာ္... သူဆီကေန

လိုအပ္သလို ယူေဆာင္အသုံးျပဳနိဳင္ပါတယ္....   သည္ေနရာမွာ      ကလစ္ျပီး၀င္လုိက္ပါ....

လုပ္နည္းကိုေတာ့ ေအာက္မွာ ရွင္းျပလိုက္ပါတယ္....

 ပထမဆုံး  မိမိ တို႕ လိုချင္ေသာ ပုံစံကို လုိက္ျပီးေရြးခ်ယ္ပါ... သူ႕ဆိုဒ္ထဲမွာ မ်ိဳးစုံပါတယ္ေနာ္

အိုေက ေရြးျပီးတာနဲ႕  ေအာက္နားက Generate ဆိုတာကို ကလစ္ေပးလုိက္ပါ  ႊဲအေပၚနားကေလ နံပါတ္ေတြ စိတ္ၾကိဳက္ ျပဳျပင္နိဳင္ေသးတယ္ေနာ္... လုိသလို ကလိေပေတာ့... အိုေက ျပီးတာနဲ႕

 Add to Blogger ဆိုတာကို ကလစ္လိုက္ပါ...  အဲခါမွာဘဲ  ဇယားတခုေျပာင္းလာျပီး

မိမိတို႕ဘေလာ့အမည္ကို ေရြးေပးျပီး ေဆ့လိုက္ယုံပါဘဲေနာ္.... လုပ္ၾကည့္လုိက္ပါေနာ္ အဆင္မေျပတာ ရွိခဲ့ပါက  ခ်က္ေဘာက္မွာ ေအာ္ခဲ့ပါ.

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

ဘေလာ့ခရီးသည္သို႕ { ဒီမွာ } သြားလိုက္ပါ
လယ္တီေျမသားသို႕{ ဒီမွာ } သြားလိုက္ပါ
စာေပနန္းေတာ္သို႕{ ဒီမွာ } သြားလိုက္ပါ

သခင္သာလွ်င္မွတင္သမွ်ကို fb မွာဖတ္ခ်င္ရင္ ဒီမွာ like ႏွိပ္ပါ

အျပည့္စံုဖတ္ခ်င္ရင္ဒီေနရာေလးေနာ္>>>>

ခရစ္စမတ္ႏွင္းးေလးေတြနဲ႕ အလွဆင္ၾကမယ္

မဂၤလာအေပါင္းနဲ႕ ျပည့္စုံၾကပါေစဗ်ာ... ခုတင္မဲ့ နည္းေလးကေတာ့ မိမိတို႕ ေဘလာ့ေလးေတြအတြက္ လွပတဲ့... ႏွင္းေလးေတြနဲ႕ တန္ဆာဆင္ေပးမဲ့...ခရစ္စမတ္ လက္ေဆာင္သေဘာမ်ိဳးးေလးပါ...တင္တာေနာက္က်ေနလို႕ ခရစ္စမတ္အတြက္လို႕ေတာ့ မေျပာေတာ့ပါဘူးးေနာ္...ဟဲဟဲ...
နည္းလမ္းေလးက လြယ္ပါတယ္.. ေအာက္မွာ ေလ့လာလိုက္ပါ

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

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


ကုဒ္ကိုရွာရခက္ပါက  မေတြ႕ခဲ့ပါက သည္လိုေရးရွာလိုက္ပါ b:skin

/*-- Breeze for Snow flakes --*/ #mbl_snowflakes { position: absolute; height: 950px; width: 966px; overflow: hidden; } #snowContainer > div { position: absolute; width: auto; height: auto; -webkit-animation-iteration-count: infinite, infinite; -webkit-animation-direction: normal, normal; -webkit-animation-timing-function: linear, ease-in; } #snowContainer > div > img { position: absolute; width: auto; height: auto; -webkit-animation-iteration-count: infinite; -webkit-animation-direction: alternate; -webkit-animation-timing-function: ease-in-out; -webkit-transform-origin: 50% -100%; } @-webkit-keyframes fade { 0% { opacity: 1; } 95% { opacity: 1; } 100% { opacity: 0; } } @-webkit-keyframes drop { 0% { -webkit-transform: translate(0px, -50px); } 100% { -webkit-transform: translate(0px, 650px); } } @-webkit-keyframes clockwiseSpin { 0% { -webkit-transform: rotate(-50deg); } 100% { -webkit-transform: rotate(50deg); } } @-webkit-keyframes counterclockwiseSpinAndFlip { 0% { -webkit-transform: scale(-1, 1) rotate(50deg); } 100% { -webkit-transform: scale(-1, 1) rotate(-50deg); } }

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

<body> 

ဆုိတာကိုဆက္ရွာေပးပါ  ေတြ႕ျပီဆိုတာနဲ႕  သူ႕ေအာက္မွာ ကပ္လွ်က္ ေအာက္ကေပးထားတဲ့ ကုဒ္ေတြကို ထည့္ေပးလိုက္ပါေနာ္...

 <script charset="utf-8" src="https://netoopscodes.googlecode.com/svn/branches/Js files/snowfall.js" type="text/javascript"></script>

<div id="mbl_snowflakes">

<div id="snowContainer">

</div>

</div>

 ျပီးးးတာနဲ႕.. မိမိတို႕ ဘေလာ့ကို preview နဲ႕စစ္ေဆးၾကည့္လိုက္ပါေနာ္...အိုေကတာနဲ႕  save template လုပ္နိဳင္ပါျပီ....

           နမူနာၾကည့္လိုပါက    သည္မွာ   ကလစ္ၾကည့္လိုက္ပါ။

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

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

ဘေလာ့ခရီးသည္သို႕ { ဒီမွာ } သြားလိုက္ပါ

သခင္သာလွ်င္မွတင္သမွ်ကို fb မွာဖတ္ခ်င္ရင္ ဒီမွာ like ႏွိပ္ပါ

အျပည့္စံုဖတ္ခ်င္ရင္ဒီေနရာေလးေနာ္>>>>

သတိထားမိေစရန္ ေစတနာနဲ႕ ေဖာ္ျပခ်က္

ကၽႊန္ေတာ္ေျပာျပခ်င္တာကေတာ့ ကၽႊန္ေတာ္တို႕ဖုန္းေတြမွာ နည္းပညာတစ္ခုကိုကိုယ္သံုးတဲံဖုန္းထဲထည့္ေတာ့မယ္ဆိုရင္ ေသျခာေအာင္ေလ့လာသံုးသပ္ျပီးမွ ယူရန္ေျပာခ်င္ပါတယ္ ဘာလို႕လည္းဆိုေတာ့ ကၽႊန္ေတာ္မ်က္ျမင္တစ္ခုျဖစ္ခဲ့လို႕ပါ တစ္ေယာက္တည္းမဟုတ္ပါဘူး...၂ေယာက္၃ေယာက္အဲလိုျဖစ္သြားလို႕အခုလိုသတိေပးစာကိုတင္ေပးလိုက္တာပါ
ေအာက္ကပံုမွာျပတဲ့ေဆာ့၀ဲလ္ ပါပဲ့....

ဒီေဆာ့၀ဲပါပဲ့ဗ်ာ သူမွာပါတဲ့အဆင့္ေတြကဒီေအာက္မွာၾကည့္လိုက္ပါ

1

 2

 3

 4

 5

 6

ဒီပံုထဲက ပံုနံပါတ္ ၄ မွာ နံပါတ္၂စာေၾကာင္းမွာပါ ကၽႊန္ေတာ္ install play လုပ္ျပီဒါနဲ႕ ဖုန္းက restart ခ်လိုက္တာဘယ္လိုမွျပန္ဖြင့္လို႕မရေတာ့ပါဘူး ဆိုင္ကိုသြားျပေတာ့ ပစ္လိုက္ေတာ့လို႕ေျပာလိုက္တယ္ 

ကၽႊန္ေတာ္သူငယ္ခ်င္းတစ္ေယာက္မွာလည္းအဲလိုပဲ့ဒီေဆာ့၀ဲလ္ကိုသံုးလိုက္တာ ဆိုင္ကိုပို႕လိုက္ရတယ္ဆိုင္ကေျပာျပတာက အထဲမွာဘာမွမက်န္ေတာ့ဘူးတဲ့ မူရင္းရွိတာေတြေတာင္အကုန္လံုးေပ်ာက္သြားခဲ့တယ္လို႕ေျပာပါတယ္

ဒါေၾကာင့္ ဒီေဆာ့၀ဲလ္ကို ေရွာင္ၾကဖို႕ တင္ျပေပးလိုက္တာပါ.......

သူငယ္ခ်င္းေတြကိုခ်စ္တဲ့....

ဘေလာ့ခရီးသည္သို႕ ဒီမွာ သြားလိုက္ပါ

သခင္သာလွ်င္မွ တင္သမွ်ကို fb မွာျမင္ခ်င္ရင္ ဒီမွာ like ႏွိပ္ပါ

အျပည့္စံုဖတ္ခ်င္ရင္ဒီေနရာေလးေနာ္>>>>