Pages

Pages

Tuesday, 18 June 2013

ပုံေလးေတြ ယိမ္းႏြဲ႕ကစားျပေနေအာင္ တင္ၾကမယ္

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

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

 .swing {
 transform-origin:50% 0;
 -moz-transform-origin:50% 0;
 -webkit-transform-origin:50% 0;
 animation:swinging 10s ease-in-out 0s infinite;
 -moz-animation:swinging 10s ease-in-out 0s infinite;
 -webkit-animation:swinging 10s ease-in-out 0s infinite;
}

@-webkit-keyframes swinging {
 0% { -webkit-transform: rotate(0);}
 5% {-webkit-transform: rotate(10deg);}
 10% {-webkit-transform: rotate(-9deg);}
 15% {-webkit-transform: rotate(8deg);}
 20% {-webkit-transform: rotate(-7deg);}
 25% {-webkit-transform: rotate(6deg);}
 30% {-webkit-transform: rotate(-5deg);}
 35% {-webkit-transform: rotate(4deg);}
 40% {-webkit-transform: rotate(-3deg);}
 45% {-webkit-transform: rotate(2deg);}
 50% {-webkit-transform: rotate(0);}
 100% {-webkit-transform: rotate(0);}
}

@-moz-keyframes swinging {
 0% {-moz-transform: rotate(0);}
 5% {-moz-transform: rotate(10deg);}
 10% {-moz-transform: rotate(-9deg);}
 15% {-moz-transform: rotate(8deg);}
 20% {-moz-transform: rotate(-7deg);}
 25% {-moz-transform: rotate(6deg);}
 30% {-moz-transform: rotate(-5deg);}
 35% {-moz-transform: rotate(4deg);}
 40% {-moz-transform: rotate(-3deg);}
 45% {-moz-transform: rotate(2deg);}
 50% {-moz-transform: rotate(0);}
 100% {-moz-transform: rotate(0);}
}

@keyframes swinging {
 0% {transform: rotate(0);}
 5% {transform: rotate(10deg);}
 10% {transform: rotate(-9deg);}
 15% {transform: rotate(8deg);}
 20% {transform: rotate(-7deg);}
 25% {transform: rotate(6deg);}
 30% {transform: rotate(-5deg);}
 35% {transform: rotate(4deg);}
 40% {transform: rotate(-3deg);}
 45% {transform: rotate(2deg);}
 50% {transform: rotate(0);}
 100% {transform: rotate(0);}
}
ထည့္ျပီးတာနဲ႕ save template လုပ္လုိက္ပါေနာ္....

  အဆင့္  (၂)   . အေနနဲ႕ကေတာ့... ပို႕စ္တင္တဲ့ေနရာကိုသြားၾကမယ္...

 ပို႕စ္တင္တဲ့ေနရာေရာက္တာနဲ႕  ပုံတင္တဲ့ အေပၚက Insert Image ဆိုတာေလးကေန  မိမိ ႏွစ္သက္ရာ ပုံကိုတင္လုိက္ပါ
အထဲမွာ ပုံေရာက္ေနတာ ေတြ႕ပါမယ္... ဆက္လက္ျပီ... ၾကည့္ုလိုက္ပါ

သည္မွာေတာ့ ေစာေစာကတင္ထားတဲ့ ပုံကို  အေပၚက HTML  ဆိုူတာကိုကလစ္ၾကည့္လိုက္ပါ.
အဲမွာ ကုဒ္ေတြကိုဘဲ ေတြ႕ရပါ့မယ္... အဲထဲက မိမိတို႕ ပုံရဲ႕ လင့္ကို ယူၾကရမွာျဖစ္ပါတယ္..
ယူတဲ့အခါ တခ်ိဳ႕ မသိသူေတြအတြက္ေပါ့ေနာ္.. ပုံရဲ႕လင့္က ဆီမီေကာ္လံေလး  အတြင္းမွာ ရွိေနမယ္.
အစကေတာ့....... http//  ဆိုတာကစျပီး   .jpg  ဆိုတာဆုံးပါတယ္...
အဲလင့္ေလးကို ေကာ္ပီယူလုိက္ပါ...ေနာက္ အဲထဲရွိတဲ့ ကုဒ္ေတြ အကုန္ဖ်က္ခ်လုိက္ပါေတာ့...
ေၾသာ္...ပုံလင့္ေကာ္ပီယူတာေလးကိုေတာ့  တေနရာရာ သိမ္းးထားအုံးေနာ္  ခဏေနျပန္သုံးးမယ္။
ေနာက္ဆုံးအေနနဲ႕   အကုန္ဖ်က္လို႕  ကြက္လပ္ၾကီးျဖစ္ေနတဲ့  ထဲကို ေအာက္ကကုဒ္ေတြ  ယူထည့္ေပးလုိက္ပါ...


<img alt="post-image" class="swing" src="သည္ေနရာမွာ ေစာေစာက သိမ္းထားတဲ့ ပုံရဲ႕လင့္ေလးကိုထည့္ေပးလိုက္ပါဗ်ာ" "style="animation-delay: 0.8s;-webkit-animation-delay: 0.8s;-moz-animation-delay: 0.8s;animation-delay: 0.8s;"/></center>
အိုေက...သည္ကုဒ္ေတြ ထည့္ျပီးတာနဲ႕ အနီေရးထားတဲ့ ဆီမီးေကာ္လံ ႏွစ္ခုအၾကားမွာ  ေစာေစာက သိမ္းထားတဲ့ ပုံေလးရဲ႕ လင့္ကို ထည့္ေပးလိုက္ပါ... ျပီးတာနဲ႕..
အေပၚက ေစာေစာက HTML ကိုကလစ္ထားေလေတာ့ ကုဒ္ဘဲ ျမင္ရမယ္ေလ...ပဲ  ခု... Compose ဆုိတာကို ကလစ္ေပးလိုက္ပါေတာ့... က်န္တာ မိမိတို႕ ေရးလိုေသာစာမ်ား  ဘာဘာညာညာ
အကုန္ ေရးခ်လုိက္ပါ ျပီးတာနဲ႕  ပို႕စ္တင္ဖို႕ အတည္ျပဳ Publish ကလစ္လုိက္ပါေတာ့..
ဒါဆို မိမိတို႕ တင္ျပီးေသာ ပို႕စ္အား ဘေလာ့ေပၚမွာ သြားၾကည့္လုိက္ပါေနာ္....
ယိမ္းႏြဲ႕ကျပ ကစားေနပါျပီ....လွတပတေလးးေနာ္..
လန္းခ်က္ ၉ ေလာက္ရွိမယ္...ဗ်ဲ. အဆင္ေျပပါေစ
ဘေလာ့ခရီးသည္

No comments:

Post a Comment