blogger မွာ ပံုေလးေတြကို effect နဲ႔ထည့္မယ္

  • ပထမဆံုအေနနဲ႔ မိမိ၏ Blogger Account ႏွင့္ Log in ဝင္လိုက္ပါ...
  • Templates >> Edit HTML ကိုသြားလိုက္ပါ...
  •  ]]></b:skin>ကိုရွာလိုက္ပါ.....။
  •  ]]></b:skin>ကိုေတြ႔ ျပီဆိုရင္ ေအာက္က ကုဒ္ေလးကို ]]></b:skin> ၏ေရွ႕မွာ ထည့္ေပးလိုက္ပါ....
img {
-webkit-transition: all 1s ease-in-out;
-moz-transition: all 1s ease-in-out;
-o-transition: all 1s ease-in-out;
transition: all 1s ease-in-out;
}
img:hover {
-webkit-transform:rotate(1080deg);
-moz-transform: rotate(1080deg);
-o-transform:  rotate(1080deg);
-ms-transform: rotate(1080deg);
transform: rotate(1080deg);
}
  • ျပီး ရင္ေတာ့ Save လိုက္ပါ....။ အေပၚက ကုဒ္ေတြကေတာ့ မိမိ ၏ ဘေလာ့ပို႔စ္
  • မွာ ရွိတဲ့ပံုတိုင္းဟာ ေမာက္ေလးနဲ႔ သြားတင္လိုက္ပါရင္ ပံုေလးဟာ လည္ေနတာကို ေတြရပါမယ္။

ေနာက္တစ္နည္း

ေနာက္တစ္နည္းကေတာ့ မိမိ၏ ဘေလာ့ပိုစ္မွာ ပံုအားလံုးကို မလည္ေစပဲ မိမိ လည္(rotate)လိုခ်င္ေသာ ပံုကိုသာလည္ေအာင္(rotate)လုပ္နည္းေလးပါ....။

  • ပထမဆံုအေနနဲ႔ မိမိ၏ Blogger Account ႏွင့္ Log in ဝင္လိုက္ပါ...
  • Templates >> Edit HTML ကိုသြားလိုက္ပါ...
  •  ]]></b:skin>ကိုရွာလိုက္ပါ.....။
  •  ]]></b:skin>ကိုေတြ႔ ျပီဆိုရင္ ေအာက္က ကုဒ္ေလးကို ]]></b:skin> ၏ေရွ႕မွာ ထည့္ေပးလိုက္ပါ....
.rotate {
-webkit-transition: all 1s ease-in-out;
-moz-transition: all 1s ease-in-out;
-o-transition: all 1s ease-in-out;
transition: all 1s ease-in-out;
}
.rotate:hover {
-webkit-transform:rotate(1080deg);
-moz-transform: rotate(1080deg);
-o-transform:  rotate(1080deg);
-ms-transform: rotate(1080deg);
transform: rotate(1080deg);
}
  • ျပီး ရင္ေတာ့ Save လိုက္ပါ....။လုပ္ေဆာင္ခ်က္ေတာ့ ျပီးသြားပါျပီ...။
  • ေနာက္တစ္ခ်က္ကေတာ့ rotate လုပ္ခ်င္တဲ့ ပံုေလးကို ဘယ္လိုထည့္ရလဲဆိုတာပါ...။
Alternate Textေအာက္မွာ ေပးထားတဲ့ ကုဒ္ေလးကို အသံုးျပဳျပီးကိုယ္
rotate လုပ္လိုေသာ ပံုေလးေတြကို Post တင္ရာမွာ ျဖစ္ျဖစ္ Widget ထည့္ရာမွာ ျဖစ္ျဖစ္ အသံုးျပဳႏိုင္ပါတယ္ ခင္ဗ်ာ.....။
<img class="rotate" src="ဒီေနရာမွာ ပံု၏ URL (link) ကိုထည့္ပါ" alt="ပံု၏အေၾကာင့္" title="ေခါင္းစဥ္ေရးပါ" />

ဘူးေရမ်က္ရြာဆိုဒ္ေလးမွ Post အသစ္တင္တိုင္း မိမိ Facebook စာမ်က္ႏွာေပၚက ဖတ္ရႈႏိုင္ရန္အတြက္ ဘူးေရမ်က္ရြာ Facebook Fan Page ေလးကို Like လုပ္ေပးပါေနာ္.... အားလံုးေသာ သူငယ္ခ်င္းမ်ားကို ခ်စ္ခင္ေလးစားလွ်က္....။
ေမာင္ေအးလြင္(ဘူးေရမ်က္ရြာ)
စာေရးသူအေၾကာင္း

က်ေနာ္သည္ ကြန္ပ်ဴတာနည္းပညာႏွင့္ပတ္သက္လွ်င္ အေျခခံ သင္တန္းေတာင္ တက္ခြင့္မရခဲ့သူပါ...မိမိကိုယ္ကို ကိုယ္ Self-Study လုပ္ေနရသူတစ္ေယာက္ျဖစ္ပါသည္ အေၾကာင္းအမ်ိဳးအမ်ိဳးေၾကာင့္ သင္တန္းတက္ခြင့္မရခဲ့သူေတြ အတြက္ အနည္းငယ္မွ် အသံုးတည့္မည္ဆိုပါက ေက်နပ္ေနသူ တစ္ေယာက္ပါ...။

0 comments:

Post a Comment