Tricks ေလးေတြ မလုပ္ဘဲ ၊ ပ်င္းေနတာၾကာေတာ့ ၊ ေရးေတာင္ မေရးၿဖစ္ဘူး။
ဒီေန႔ေတာ့ က်ေနာ့္ ညီေတာ္ ေၾကာင့္ စာၿပန္လုပ္ရင္းနဲ႔ ဒီ Tricks ေလးကို စဥ္းစားမိသြားပါတယ္။

စာဖတ္သူတို႔ အေနနဲ႔ ပံုတစ္ပံုကို အေပၚေအာက္ ၊ ဘယ္ညာ ေၿပာင္းၿပန္လွည့္တာကို PhotoEditing Software နဲ႔မဟုတ္ဘဲ ၊ code ေလး တစ္ေၾကာင္းတည္းနဲ႔တင္ မလုပ္ခ်င္ဘူးလား။
အဲဒီ့လိုလုပ္ခ်င္ခဲ့သူေတြအတြက္ အခုခ်ိန္မွာ လုပ္လို႔ရလာပါၿပီ။

ဒီနည္းက အသစ္ၿဖစ္ခ်င္မွၿဖစ္မယ္။ ဟိုတစ္ခါ Triangle လုိဘဲ ကြ်န္ေတာ့္ဟာကြ်န္ေတာ္စမ္းၿပီးရသြားေပမယ့္ Online မွာရွာၾကည့္ရင္လည္း ေတြ႔ခ်င္ေတြ႔ဦးမွာ။ (ရွာေတာ့ဘူး။ စိတ္ပိန္တယ္။ ကိုယ္အရင္ရွာေတြ႔တယ္ဆုိတဲ့ Feeling နဲ႔ဘဲ ေနေတာ့မယ္။ )

ဘာမွမခက္ခဲပါဘူး... ေလ့လာၾကည့္ရေအာင္

ေအာက္မွာေတာ့ CSS code ပါ

Code:

.right-left {
-webkit-transform: scale(-1,1);
-moz-transform: scale(-1,1);
transform: scale(-1,1);
}

ေအာက္မွာ HTML code ၿဖစ္ပါတယ္

Code:

<img src="http://www.google.com/intl/en_ALL/images/srpr/logo1w.png" class="right-left" />

ဟီးဟီး။ Google Logo အသစ္ေလးကို ပါကင္ဖြင့္ (အဲအဲ) ကလိလိုက္ၾကရေအာင္...
အဲဒီ့ Code ေတြကိုသိမ္းၿပီး ၿပန္ဖြင့္ၾကည့္မယ္ဆုိရင္ ေတြ႔ရမွာကေတာ့................... ကိုယ္တုိင္လုပ္ၾကည့္လိုက္ပါ.

အဲဒီ့မွာဆုိရင္ scale(-1,1); ရဲ႕ value ေတြက အဓိက ၿဖစ္ပါတယ္။ သူ႔ကို လိုသလို ခ်ိန္ႏိုင္မယ္ဆုိရင္ ၾကိဳက္သလို လွည့္လို႔ရပါတယ္။ အေပၚ ၊ ေအာက္ ၊ ဘယ္ ၊ ညာ ၊ အေပၚဘယ္ ၊ အေပၚညာ ၊ ေအာက္ဘယ္ ၊ အုိ... စံုလို႔ဗ်ာ။ လုပ္ခ်င္သလို လုပ္လို႔ရမယ္။ က်န္တာကေတာ့ Cross-Browser-Issue အတြက္ ၃ လုိင္းၿဖစ္ေနတာပါ။ တကယ္ေတာ့ code က တစ္ေၾကာင္းထဲပါဘဲ။
တကယ္ေတာ့ ဦးေႏွာက္မရိွတဲ့ Computer ကို လူက လွည့္စားလုိက္ၿခင္း တစ္မ်ိဳးဘဲၿဖစ္ပါတယ္။

ပံုတစ္မ်ိဳးထဲလား? မဟုတ္ဘူးဗ်ာ။ ၾကိဳက္တဲ့ Element ကို ၊ ၾကိဳက္သလို သာလုပ္။ အားလုံး အလုပ္လုပ္မယ္။
အဲ ၊ Browser ကိုေတာ့ နည္းနည္း ၿမင့္တာေလးနဲ႔ ၾကည့္ၾကေပါ့ေနာ္။ သံုးစားမရတဲ့ IE နဲ႔ၾကည့္လို႔ မေပၚရင္ေတာ့ တားတားလည္း မတိ။

မ်ားမ်ားကလိႏိုင္ၾကပါေစ.
$ƴǩǾ

Demo ၾကည့္ခ်င္တဲ့ သူေတြအတြက္လည္း စီစဥ္ေပးထားပါတယ္။ ေအာက္က Link မွာ ၾကည့္ႏုိင္ပါတယ္

Code:

http://www.myanmaritresource.info/Flip_Demo-h18.htm