نمودج مميز لأزرار المواقع الاجتماعية
و في النافذه المنبثقة نضع الكود و لا حاجة الى اعطاء اسم النمودج
<div style='position: fixed; bottom: 0%; right: 0%;'/><a href="http://blogspacetech.blogspot.com/" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjM3O4_VrncV6tk7x2Yz206ayF_eJyRLisdSWdXxkuEhKPlqZKHnqyA0jqV9RXobkE0riEsytMmuqHeog1dDrma3FRogJz75M5uLRSKO-6OeKUNHjufWklSwT17fSU0mGquW34d18L19Cw/s1600/contacts.png" /></a><br /><a href="http://www.twitter.com/TWITER USERNAME/" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmLb0Zn6V5XnoyHEpRLUPHNnFH6F6ZOgyEY1dHYknsouI3dkzaHCdrSD4T-OPHxrMzqe7ZSc4PezJzRfdFRKMUJrXPbR5YvCSkCEHBVkTmu1b9fxppIypYbXBOicz8FsyOAVi7L0LqRfQ/s320/icontexto-inside-twitter.png" /></a><br /><a href="http://www.facebook.com/FACEBOOK USERNAME/" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMK1d8wyk5ytKqUeb4xBILOcY_HyLtZpBQKtX3PJMoFu0mSgzk8Wnu0fTJjBGi3UTJX5XWVsm-p1TfXt6viwwB-zf7qdygIgzz7mwLO9Bh2HD1eWkhS5ipY86XYLpR85c3kVIiS_ijMHY/s320/icontexto-inside-facebook.png" /></a><br /><a href="http://feeds.feedburner.com/FEEDBURNER ID" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEih2QjpkuM6N8eIY6k0qwJ0Rf9cUebSyykiTu-50OyVUIJZNAvBtdj0hkGdFq_e1f7WbFSaU-mpWmsQUWdkZWz65pOspw4PaUbkVJka0nP_QwM5rShfJ1ObNUkJ4jkn02jDcozmArrPw5g/s320/icontexto-inside-rss.png" /></a><br /><a href="http://...mail.com" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQHhkgeOoO6dOv7uczykJmzK0ixj1Ecc7rL4O1hXyrv8Sp5LTOFgKMFAZMj7yE9zZX7FWi51LGZXwOyeGOjyTEcO4CXwCHiVbsT2ru3K-fx3w7pxpjSeX9vuSt2CZbrfNR819VwlBI5Ck/s1600/mail-copy.png" /></a></div> 
و التي سوف يبقى تموضعها تابث اثناء تصفح مدونتك .
في هدا الموضوع استخدمنا خاصيتان أساسيتان
'position: fixed;
target="_blank"
|
-
العفو أخي أبو إياد
فخاصيةposition fixed هي من أهم الخواص
في البرمجة وعن طريقها تستطيع عمل حيل رائعة
بالنسبة للكود السابق فهو مازال في طور التطوير
و يحتاج الى تأثيرات عديدة...
تحياتي لك أخي الكريم
-
العفو أخي الكريم
صحيح هدا لأني وجدت مشكلة مع الاضافة السابقة في مدونتك
فعندما أريد أن اعلق في أي موضوع فهي تزعجني..
بارك الله فيك و أحسنت الاختيار !
تحياتي !
-
@ غير معروف
هدا صحيح تم اضافة له كود الcss فقط
/*********************/
/* Social Sites */
/*********************/
a.twitter img,a.facebook img,a.rss img {
opacity:0.8;
}
a.twitter:hover img,a.facebook:hover img,a.rss:hover img {
opacity:1;
}
-
@ متابع
لا عليك اخي..فهمت الفكرة..
بالنسبة للثاتير فيمكنك الحصول عليه بتدخل من مكتبة jquery
<script type='text/javascript'>
// <![CDATA[
$(document).ready(function() {
$('a.blogspacetech').hover(function() { //mouse in
$(this).animate({ paddingLeft: '45px' }, 400);
}, function() { //mouse out
$(this).animate({ paddingLeft: '1px' }, 400);
});
});
//]]>
</script>
و لا تنسى الحصول على وصلة لآخر إصدار من المكتبة لربطها برأس
الصفحة داخل الوسم <head> هكذا:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js" type="text/javascript"></script>
أخيرا كود ال HTML
<a href="#"class="blogspacetech"><img src="Url-image" /></a>
حاليا انا ابحث عن كيفية جعل الثأتير فقط بواسطة ال css3
ان كانت لديك فكرة حول دالك فهدا يشرفنا..
تحياتي
شكرا أخي الكريم أزرار مميزة فعلا ،واصل في انتظار الجديد