Cool Mouse Hover Social Media Buttons for Blogger

ဘေလာ့မိတ္ေဆြမ်ား မဂၤလာပါဗ်ာ..

အလန္းဒီဇိုင္းတမ်ဴိးျပန္မွ်ေဝေပးပါရေစ

မိမိတို႔ရဲ႕ဘေလာ့မွာေအာက္ကပံုေလးအတိုင္းလုပ္ခ်င္တဲ့သူငယ္ခ်င္းမ်ားအတြက္ပါ

လုပ္ရတာလည္းအရမ္းလြယ္ကူပါတယ္..စိတ္ဝင္စားရင္ ေအာက္မွာကုဒ္ေတြေပးထားပါတယ္

မိသားစုအိမ္ေလး

ဒီမွာလည္း >>> Demo <<< ၾကည့္လို႔ရပါတယ္..
လုပ္နည္းကေတာ့ အရင္ဆံုး >> ဒီကိုဝင္ပါ <<
ဝင္ျပီးရင္ >>Layout ျပီးရင္ >>Add a Gadget ႏွိပ္ပါ ျပီးရင္
က်လာေသာ ေဘာက္အထဲမွ >>HTML/JavaScript ကိုရွာျပီး
ထပ္က်လာေသာအထဲတြင္ ေအာက္မွေပးထားေသာ
ကုဒ္မ်ားထည့္ျပီး >>Save လိုက္ပါ ဒါဆိုရင္အဆင္ေျပသြားပါျပီ

<style>
#FamilyHome-Blogger {
width: 260px;
margin: 5px 20px;
padding:5px;
}
#FamilyHome-Bloggerli {
cursor: pointer;
height: 48px;
position: relative;
list-style-type: none;
}
#FamilyHome-Blogger .icon {
background: #D91E76 url('http://3.bp.blogspot.com/-unjaHZfdU1k/UK7b1J4pfOI/AAAAAAAAAzA/r7ccqS2FovU/s1600/MoreBlogTools-SNS.png') 0 0 no-repeat;
background-color: rgba(217, 30, 118, .42);
border-radius: 30px;
display: block;
color: #141414;
float:none;
height: 48px;
line-height: 48px;
margin: 5px 0;
position: relative;
text-align: left;
text-indent: 90px;
text-shadow: #333 0 1px 0;
white-space: nowrap;
width: 48px;z-index: 5;
-webkit-transition: width .25s ease-in-out, background-color .25s ease-in-out;
-moz-transition: width .25s ease-in-out, background-color .25s ease-in-out;
-o-transition: width .25s ease-in-out, background-color .25s ease-in-out;
transition: width .25s ease-in-out, background-color .25s ease-in-out;
-webkit-box-shadow: rgba(0, 0, 0, .28) 0 2px 3px;
-moz-box-shadow: rgba(0,0,0, .28) 0 2px 3px; -o-box-shadow: rgba(0,0,0, .28) 0 2px 3px;
box-shadow: rgba(0, 0, 0, .28) 0 2px 3px;
text-decoration: none;
}
#FamilyHome-Blogger span:hover {
visibility: hidden;
}
#FamilyHome-Blogger span {
display: block;
top: 15px;position: absolute;
left: 90px;
}
#FamilyHome-Blogger .icon {
color: #fafafa;
overflow: hidden;
}
#FamilyHome-Blogger .fb {
background-color: rgba(45,118,185, .42);
background-position: 0 -382px;
}
#FamilyHome-Blogger .twit {
background-color: rgba(0, 161, 223, .42);
background-position: 0 -430px;
}
#FamilyHome-Blogger .google {
background-color: rgba(167, 0, 0, .42);
background-position: 0 -478px;
}
#FamilyHome-Blogger .pint {
background-color: rgba(204, 0, 0, .42);
background-position: 0 -526px;
}
#FamilyHome-Blogger .linked {
background-color: rgba(0, 87, 114, .42);
background-position: 0 -574px;
}
#FamilyHome-Blogger .deviant {
background-color: rgba(76, 122, 74, .42);
background-position: 0 -622px;
}
#FamilyHome-Blogger .ytube {
background-color: rgba(170, 0, 0, .42);
background-position: 0 -670px;
}
#FamilyHome-Blogger .rss {
background-color: rgba(255,109, 0, .42);
background-position: 0 -718px;
}
#FamilyHome-Blogger li:hover .icon {
width: 250px;
}
#FamilyHome-Blogger li:hover .icon {
background-color: #d91e76;
}
#FamilyHome-Blogger li:hover .fb {
background-color: #2d76b9;
background-position: 0 2px;
}
#FamilyHome-Blogger li:hover .twit {
background-color: #00A1DF;
background-position: 0 -46px;
}
#FamilyHome-Blogger li:hover .google {
background-color: #A70000;
background-position: 0 -94px;
}
#FamilyHome-Blogger li:hover .pint {
background-color: #C00;
background-position: 0 -142px;
}
#FamilyHome-Blogger li:hover .linked {
background-color: #005772;
background-position: 0 -190px;
}
#FamilyHome-Blogger li:hover .deviant {
background-color: #4C7A4A;
background-position: 0 -238px;
}
#FamilyHome-Blogger li:hover .ytube {
background-color: #A00;
background-position: 0 -286px;
}
#FamilyHome-Blogger li:hover .rss {
background-color: #EC5601;
background-position: 0 -334px;
}
#FamilyHome-Blogger .icon:active {
bottom: -2px;-webkit-box-shadow: none;
-moz-box-shadow: none;
-o-box-shadow: none;
}
</style>

<ul id="FamilyHome-Blogger">
<li><a href="www.facebook.com/ngehtwe.aung" class="icon fb">Like us on Facebook</a>
</li>
<li><a href="https://twitter.com/FamilyHome3" class="icon twit">Follow us on Twitter</a>
</li>
<li><a href="https://plus.google.com/u/0/114391427363211781306" class="icon google">Follow us on Google+</a>
</li>
<li><a href="http://feeds.feedburner.com/blogspot/QKBwI?format=xml" class="icon rss">Subscribe via RSS</a>
</li>
</ul>

(မွတ္ခ်က္)အနီနဲ႔ျပထားေသာ ေနရာမ်ားတြင္မိမိရဲ႕နာမည္၊နံပါတ္လင့္ခ္မ်ား

အစားထိုးေပးပါ။

----------------------------------

facebook >> ngehtwe.aung

twitter >> FamilyHome3

plus.google >> 114391427363211781306

feeds.feedburner >> http://feeds.feedburner.com/blogspot/QKBwI?format=xml

----------------------------------

အားလံုးအဆင္ေျပၾကပါေစဗ်ာ မသိေသးေသာသူငယ္ခ်င္းမ်ားအားမွ်ေဝေစလိုပါသည္။

အစဥ္ျမဲခင္မင္ေလးစားလၽွက္ မိသားစုအိမ္ေလး http://familyeainlay.blogspot.com/

မိသားစုအိမ္ေလး လင့္ခ္ကို မိမိတို႔ရဲ႕ဘေလာ့မွာမိတ္ဆက္လိုပါက

ေအာက္မွကုဒ္မ်ားကူး၍ ခ်ိတ္ဆက္ႏိုင္ပါတယ္ခင္ဗ်ာ..။

- ခ်ိတ္ဆက္ရန္ Link - ™

URL :

Code For Forum :

HTML Code :

<a href='http://familyeainlay.blogspot.com/2013/08/cool-mouse-hover-social-media-buttons.html' target='_blank'>Cool Mouse Hover Social Media Buttons for Blogger</a>

သင္လက္ရွိဖတ္ေနေသာဘေလာ့ပိုစ့္ရဲ႕ေခါင္းစဥ္ Cool Mouse Hover Social Media Buttons for Blogger ပိုစ့္ရဲ႕ URL Linkhttp://familyeainlay.blogspot.com/2013/08/cool-mouse-hover-social-media-buttons.html အားေပးမႈအတြက္ မိသားစုအိမ္ေလး မွ ေက်းဇူးအထူးတင္ရွိပါတယ္ ။