تواصل وتفاعل مع المدونة

.showpageArea a { text-decoration:underline; } .showpageNum a { border:1px solid #aeaeae; margin:0 3px; padding:3px 7px; text-decoration:none; } .showpageNum a:hover { background-color:#0a8be5; border:1px solid #000000; } .showpagePoint { -moz-background-clip:border; -moz-background-inline-policy:continuous; -moz-background-origin:padding; background:#aeaeae none repeat scroll 0 0; border:1px solid #aeaeae; color:#333333; margin:0 3px; padding:3px 7px; text-decoration:none; } .showpageOf { margin:0 3px 0 0; padding:3px 7px; text-decoration:none; } .showpage a { border:1px solid #aeaeae; padding:3px 7px; text-decoration:none; } .showpage a:hover { text-decoration:none; } .showpageNum a:link, .showpage a:link { color:#333333; text-decoration:none; }

الخميس، 29 سبتمبر 2011

صندوق المعجبين فايسبوك منزلق بتقنية Jquery


السلام عليكم ورحمة تعالى وبركاته كيف حالكم اخواني الاعزاء مرحبا بك في مدونتي المتواضعة ,سوف نعرف اليوم على كيفية اضافة صندوق الفايسبوك

صندوق الفايسبوك بتقنية Jquery لمدونات بلوقرعلى مدونة  عربي كاش 


والمثال في جانب هدا الموضوع عند مرور الماوس على صورة الفايسبوك فإن الصندوق ينزلق بسرعة

لاضافة الصندوق بمدونتك ما عليك سوى اتباع الخطوات السريعة التالية



ادا لم تكن قد اضافت من قبل احدى ادوات الجوكري بمدونتك فأنصحك بإضافة هدا الرمز وهو عبارة عن 
Jquery JavaScript
لكي تدعم مدونتك اضافات مكتبة الجوكري
ادهب الى تصميم + تحرير واجهة عناصر المستخدم 
ثم ابحث عن الرمز التالي <header/>  ثم مباشرة قبله اضف الرمز التالي:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script>

ولاضافة الصندوق في مدونتك ماعليك سوى نسخ الرمز التالي ثم التوجه الى لوحة تحكم مدونتك
ثم اظغط تصميم ثم اضافة اداة جديدة اختر اداة الجافا سكريبت في النافدة المنبثقة والصق الرمز التالي

<script type="text/javascript">
//<!--
$(document).ready(function() {$(".w2bslikebox").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-250"}, "medium");}, 500);});
//-->
</script>
<style type="text/css">
.w2bslikebox{background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhuSBi_SCjx13RNk89LJ-bX4zEEfhShq_fg3kn33-fX83x1mUIdQXoM8onwL8WecjKSuoo5UkIoArAE4ahN5AOfFsYZZ4RWD1JxHGMkdcgKDaoRA1av1QF5I2l00VfkPdtOdchnL2pj_-UI/s150/w2b_facebookbadge.pn") no-repeat scroll left center transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 46px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:20%;}
.w2bslikebox div{border:none;position:relative;display:block;}
.w2bslikebox span{bottom: 12px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}
.w2bslikebox span a{color: #808080;text-decoration:none;}
.w2bslikebox span a:hover{text-decoration:underline;}
</style><div class="w2bslikebox" style=""><div><iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Ffacebook.com%2Farabicash2&amp;width=245&amp;colorscheme=light&amp;show_faces=true&amp;connections=9&amp;stream=false&amp;header=false&amp;height=270" scrolling="no" frameborder="0" scrolling="no" style="border: medium none; overflow: hidden; height: 270px; width: 245px;background:#fff;"></iframe><span>By <a href="http://arabicash2.blogspot.com">arabicash2</a> / <a href="http://arabicash2.blogspot.com/2011/09/blog-post_29.html">+أحصل عليها!</a></span></div></div>



ماعليك سوى تغيير اسم مدونتي الملون باللون الاخضر على الفايسبوك برابط مدونتك على الفايسبوك






abuiyad

7 التعليقات:

  1. السلام عليكم ورحمة الله وبركاتة
    لقد طبقت هذة التدوينة على مدونتي بارك الله بك أخي جامع

    ردحذف
  2. طريقه جميله
    أعجبتني كثيراً


    بوركتم و بوركت الجهود

    ردحذف
  3. مبروك عليك اخي ناجح اتمنى لك تصفح ممتع

    ردحذف
  4. الأميرة سندريلآ** وانت كدلك اختي بارك الله فيك

    ردحذف
  5. طريقه جميله
    أعجبتني كثيراً

    ردحذف
  6. ياريت اكلم حضرتك ع الخاص لسؤالك بعض الاسئله

    ردحذف
  7. اخي انا في الخدمة دائماً واي وقت انا رهن اشارتك

    ردحذف

رسالة أحدث رسالة أحدث الصفحة الرئيسية
back to top