How To Add 3D Social Icons With Rotate Spin Effect To Blogger

ဒီေန႔တင္တဲ့ ပုိ႔(စ္)ေလးကေတာ့ 3D Social Icons With Rotate Spin Effect ေလးပါ။ Social Icon ေလးကုိ Mouse နဲ႔ထိလုိက္ရင္ Rotate/လည္တဲ့ Cond ေလးပါ။ ႀကဳိက္ၾကမယ္လုိ႔လည္းေမွ်ာ္လင့္ပါတယ္။ ေအာက္မွာ Demo သြားၾကည့္နုိင္ရန္ လင့္(ခ္) နဲ႔တကြ Cond လည္းေပးထားပါတယ္။ Google မွာ Sign In / Follow ၀င္ေပးပါလုိ႔လည္း ေမတၱာရပ္ခံပါတယ္။

Preview

၁။Sign In Blogger

၂။ Layout

၃။ Add a Gadget

၄။ HTML/JavaScript

၅။ ေအာက္က ေပးထာတဲ့ Cond ေလးကုိထည့္ေပးလုိက္ပါ။

<style> #social a:hover {background-color: transparent;opacity:0.7;} #social img { -moz-transition: all 0.8s ease-in-out; -webkit-transition: all 0.8s ease-in-out; -o-transition: all 0.8s ease-in-out; -ms-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; } #social img:hover { -moz-transform: rotate(360deg); -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); -ms-transform: rotate(360deg); transform: rotate(360deg); } </style> <center><div id="social"> <!--Start Rss Icon--> <a title="Grab Our Rss Feed" href="ဒီေနရာမွာမိမိ၏ Feed လင့္(ခ္) ထည့္ေပးလုိက္ပါ-YOUR-FEED-URL-HERE" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiEJpXGsxPvJiqGxZ4G98Db9TfW3DgFcm92LdlgAM6Afgv_96OTXl2wGCou-v7qSNGdskfSuIvR1CKWviuPv0IyrjqCcJgogAQwL3WYM7PrtQcZZTWrRocZOToIt2fgpC6t9EGe7IcGF1C4/s1600/RSS-48x48.png" style="margin-right:1px;" alt="Icon"/></a> <!--End Rss Icon--> <!--Start Email Rss Icon--> <a rel="nofollow" title="Get Free Updates Via Email" href="ဒီေနရာမွာမိမိ၏ Email RSS လင့္(ခ္) ထည့္ေပးလုိက္ပါ-YOUR-EMAIL-RSS-URL-HERE" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiBHAsNhyN-NioFqUfjHxiv8KMWSdUPKkcQKVb9ouw-8VFpcjSRCxlGwxVBqwAg-_KQJkR93tWfDpWR2bq1z5EGFu1X-toj4m9bczgkY4e3FRU3OHvF1Vy8HctUI9oHfc7_RCRp-i4tjINj/s1600/RSS-EMAIL-48x48.png" style="margin-right:1px;" alt="Icon"/></a> <!--End Email Rss Icon--> <!--Start Facebook Icon--> <a rel="nofollow" title="Like Our Facebook Page" href="ဒီေနရာမွာမိမိ၏ Facebook လင့္(ခ္) ထည့္ေပးလုိက္ပါ-YOUR-FACEBOOK-PAGE-URL-HERE" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKjh3zkPHI1MfijJ4DXUv5yNNXuo5Xc2F0Tdr4-LTfKtX8_vZZZcHfmVvEPQCltoI_5fmtZto2kXv4XMq3Uas4KpKHnNAs4A_oubQNxXa9xN5Ll4KxdPNyNRQIveTDo6b0vC04MgBI5E0F/s1600/FACEBOOK-48x48.png" style="margin-right:1px;" alt="Icon"/></a> <!--End Facebook Icon--> <!--Start Twitter Icon--> <a rel="nofollow" title="Follow Our Updates On Twitter" href="ဒီေနရာမွာမိမိ၏ Twitter လင့္(ခ္) ထည့္ေပးလုိက္ပါ-YOUR-TWITTER-URL-HERE" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjBYL7WXasT1z_M3waJeZkHa2xkIxhtmpMRs3GTZWdlTqnzaZ8_X2XFfCNBusvtGFwE8iMPCIewzMf3QOQW8leFw4oDHCs-P4xes4fDLDIROOEDFEKT_mEjw9xLIIDE7YusEeTRGkDUlA0n/s1600/TWITTER-48x48.png" style="margin-right:1px;" alt="Icon"/></a> <!--End Twitter Icon--> <!--Start Google+ Icon--> <a title="Follow Us On Google+" rel="nofollow" href="ဒီေနရာမွာမိမိ၏ Google Plus လင့္(ခ္) ထည့္ေပးလုိက္ပါ-YOUR-GOOGLE-PLUS-URL-HERE" target="_blank"><img style="margin-right:1px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmIEJIdteM2tTtxj3KXgfK2K1cHjqJ3_sMOIdLhDoPY71o-lhSzL72otAEmqC-LmI23Xw-zpHWDh6qR8aCd-V-kpvKfmKMPBhXRWKlP-j81HzxRgUgG2qu5i2mg8zTIfZrOySCEfVjXzY4/s1600/GOOGLE-PLUS-48x48.png"/></a> <!--End Google+ Icon--> <!--Start Pinterest Icon--> <a title="Follow Our Pins" rel="nofollow" href="ဒီေနရာမွာမိမိ၏ Pinterest လင့္(ခ္) ထည့္ေပးလုိက္ပါ-YOUR-PINTEREST-URL-HERE" target="_blank"><img style="margin-right:1px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhJMeEoc0A-_X4Ss6q-oCxuve8D94QViy3wg2VUylPQaq-ci_oH8F-C-Qf-l6X3TfsVgyEAskri2RcgUzPUP3B62g02a5jBbcUSPE0p0z7aPP7Cn5b8phepk04-ATO5IPsX_ES_AHL68eZx/s1600/PINTEREST-48x48.png" alt="Follow Me on Pinterest" /></a> <!--End Pinterest Icon--> </div><br/> <!--Start Feed Count Button--> <a href="ဒီေနရာမွာမိမိ၏ FeedBurner လင့္(ခ္) ထည့္ေပးလုိက္ပါ-YOUR-FEEDBURNER-URL-HERE" target="_blank"><img alt="spice up your blog" src="http://feeds.feedburner.com/~fc/blogspot/wyygl?bg=99CCFF&fg=444444&anim=0&label=listeners" /></a><!--End Feed Count Button--> </center>

အားလုံးၿပီးသြားရင္ Save ကုိ နုိပ္ေပးလုိက္ပါ။