jquery: أزرار مشاركة اجتماعية بتأثيرات رائعة

السلام عليكم ورحمة الله تعالي وبركاته في تدوينة اليوم سأقوم بنشر أزرار للمشاركة الاجتماعية صنعتها مؤخراً يمكنكم استخدامها في مدونتكم لوضع روابط صفحاتكم علي المواقع الإجتماعية.

الشرح:-

توجه إلي لوحة التحكم/التخطيط/إضافة أداة Html/Javascript.

ثم اضف الكود التالي

<div id="social"><a class="slinks"  href="FB-LINK" ><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjKwOKCnZ2DZhU4OD9CMUlROZSOfX4FVpDDl68qSh7XHStv1717oYd5aUgOEoG7NGUDaAgEb_oJTmbvGuqiT69s_BE4ZyuLTsRxyc2q22kWxfiICKUF3sQuxx6dbbubGlCq3HSyX1E72mU/s1600/th3skill-fb.png" title="facebook" width="70" height="70" /></a><a class="slinks" href="G-LINK"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjRALiv928LIvY05Ty0dMYddniR_3rWvzn9fG80EWfHCygYULlMo86QNlPZ9YMOAla2w7nGuVG-tFBcaQdpXDDWRMMsx7KFML6ewHzK8s_9obrHgpx7YFtl07KjMw7cyG4banSjGJXKNQ/s1600/TH3SKILL-PLUS.png" title="google+" width="70" height="70"  /></a><a class="slinks" href="TWITTER-LINK"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiljZJob2sVBM5AsUKs3tS7nfAOFMdmjUpHTCg1KVQoc4RAsy1jRcTxEuQFmxRbYwoyoBmhEb4vUOMbmbawn8VHn9x7vVNCsA5AzAV_lYQN2KXkRe9A2rBQ0A4k4FaBn4EwK-aoJaapoZw/s1600/Twitter.png" title="twitter" width="70" height="70"  /></a></div><script type="text/javascript">$(document).ready(function(){$(".slinks").fadeTo("slow",0.5);$(".slinks").hover(function(){    $(this).stop().animate({      "top":"10px",   "opacity":"1"      },"fast");    },function(){      $(this).stop().animate({      "top":"2px",   "opacity":"0.5"},"fast");      });});
</script><style type="text/css"> div#social {text-align:center;}</style>

FB-LINK رابط حسابك علي الفيسبوك

 G-LINK رابط حسابك علي جوجل بلس

TWITTER-LINK رابط حسابك علي تويتر

والآن مبروك عليك - لا تنس دعمنا في التعليقات لنستمر في المواضيع :)

المعاينة