1. ĐЯ-ЩΘЩΘ

    ĐЯ-ЩΘЩΘ iq-team مراقب عآم

    الأنتساب:
    ‏13 يوليو 2014
    المشاركات:
    512
    الإعجابات المتلقاة:
    50
    نقاط الجائزة:
    28
    الجنس:
    ذكر
    الإقامة:
    مكة مكرمة
    [​IMG]


    » الصلاة و السلام على أشرف المرسليـن ...~
    » الحمد لله وحده نحمده و نشكره و نستعينه و نستغفره و نعود بالله من شرور أنفسنا و من سيئاتأعمالنا ...~
    » من يهده الله فلا مظل له و من يظلل فلن تجد له ولياً مرشدا ...~
    » و أشهد ألا إلاه إلا الله وحده لا شريك له و أن محمداً عبده و رسوله صلى الله عليه و سلم ...~
    » وعلى آله و صحبه أجمعين و من تبعهم بإحسان إلى يوم الدين ...~
    » ربنا لا علم لنا إلا ما علمتنا إنك أنت العليم الخبير ...~
    » ربنا لا فهم لنا إلا ما فهمتنا إنك أنت الجواد الكريم...~
    » ربي اشرح لي صدري و يسر لي أمري و احلل عقدة من لساني يفقهوا قولي ...~

    » أما بعد ...~

    » فإن أصدق الحديث كتاب الله تعالى و خير الهدي هديُ سيدنا محمد صلى الله عليه و سلم ...~
    » و شر الأمور محدثاتها و كل محدثة بدعة و كل بدعة ضلالة و كل ضلالة في النار ...~
    » فاللهم أجرنا و قنا عذابها برحمتك يا أرحم الراحمين ...~

    [​IMG]


    اليوم اقدم كم كود ايقونات تواصل الاجتماعي عملته قبل فتره لكن لم يسن لي الوقت لطرحه لكم

    اليوم اضعه بين ايديكم

    الكود

    [HTML CODE]
    <div class="Social">
    <a target="_blank" href="رابط حسابك">
    <div class="facebook">
    <img src="https://cdn1.iconfinder.com/data/icons/logotypes/32/square-facebook-48.png">
    </div></a>
    <a target="_blank" href="رابط حسابك">
    <div class="google"><img src="https://cdn1.iconfinder.com/data/icons/logotypes/32/square-google-plus-48.png">
    </div></a>
    <a target="_blank" href="رابط حسابك">
    <div class="twitter"><img src="https://cdn1.iconfinder.com/data/icons/logotypes/32/square-twitter-48.png">
    </div></a>
    </div>[/HTML CODE]



    أكواد CSS


    [CSS]
    .Social{
    top:200px;
    width:50px;
    height:200px;
    right:0;
    position:fixed
    }

    .Social:hover{
    width:120px;
    box-shadow:0 0 0 #000;
    top:200px;height:200px;
    right:0;
    position:fixed
    }

    .facebook{
    background-color:#3b5998;
    width:50px;
    transition:width .5s ease .15s;
    top:200px;
    right:0;
    position:fixed
    }

    .facebook:hover{
    background-color:#3b5998;
    top:200px;
    right:0;
    width:120px;
    position:fixed;
    box-shadow:1px 1px 8px #000
    }


    .google{
    background-color:#de2f2f;
    width:50px;
    transition:width .5s ease .15s;
    top:250px;
    right:0;
    position:fixed
    }

    .google:hover{
    background-color:#de2f2f;
    top:250px;
    right:0;
    width:120px;
    position:fixed;
    box-shadow:1px 1px 8px #000
    }

    .twitter{
    background-color:#55acee;
    width:50px;
    transition:width .5s ease .15s;
    top:300px;
    right:0;
    position:fixed
    }

    .twitter:hover{
    background-color:#55acee;
    top:300px;
    right:0;
    width:120px;
    position:fixed;
    box-shadow:1px 1px 8px #000
    }
    [/CSS]


    هذا مثل مباشر لكود

    [ أضغط هنا ]



    [​IMG]


    » وبكذا انتهى موضوعي لليوم ...~

    » كل ما اريد هو دعوة صادقه برحمه للوالده ...~

    » تقبلو تحياتي انا اخوكم في الله ...~

    » أحمد...~

    [​IMG]
     
    1 person likes this.
  2. Wolf Hex

    Wolf Hex DeveloPer Plus

    الأنتساب:
    ‏24 فبراير 2015
    المشاركات:
    264
    الإعجابات المتلقاة:
    1
    نقاط الجائزة:
    18
    الوظيفة:
    Student
    الإقامة:
    دولة أمير المؤمنين (ع)
    رد: كود ايقونات تواصل الاجتماعي

    سلمت الاناملُ شكراً ع مجهودك الطيب
     
  3. -AL SenatoOoR-

    -AL SenatoOoR- V • I • P

    الأنتساب:
    ‏14 أغسطس 2014
    المشاركات:
    803
    الإعجابات المتلقاة:
    29
    نقاط الجائزة:
    28
    الجنس:
    ذكر
    الإقامة:
    [[ الـــعرآق الــــعظيم ]]
    رد: كود ايقونات تواصل الاجتماعي

    ياهلا بيك احمدهذا الموضوع الي كنت ابحث عنه صارلي فترة
    بارك الله بك {1!$7}
    ماذا تعتقد في مشاركة ĐЯ-ЩΘЩΘ؟يعجبني ويستحق التقييم
     
  4. Exe.iQ

    Exe.iQ DeveloPer Plus

    الأنتساب:
    ‏3 أغسطس 2014
    المشاركات:
    347
    الإعجابات المتلقاة:
    11
    نقاط الجائزة:
    18
    رد: كود ايقونات تواصل الاجتماعي

    سلمت اناملك أخي على الكود رائع جداًياريت لو تعلمني طريقة وضع الكود في صفحة html او php
    اين اضع الاكواد بالضبط؟
     
  5. Ali raad

    Ali raad عٍشْقْتْهٌاٌ بّـصٍـمِـ مشرف

    الأنتساب:
    ‏21 فبراير 2015
    المشاركات:
    395
    الإعجابات المتلقاة:
    767
    نقاط الجائزة:
    93
    الجنس:
    ذكر
    الوظيفة:
    طًاٌلِـبّـ
    الإقامة:
    اٌلِـعٍرُاٌقْ - بّـاٌبّـلِـ
    رد: كود ايقونات تواصل الاجتماعي

    دائما مبدع حمود :{1!}:
     
  6. th3 Spl0it

    th3 Spl0it Developer

    الأنتساب:
    ‏10 مارس 2015
    المشاركات:
    116
    الإعجابات المتلقاة:
    2
    نقاط الجائزة:
    18
    الإقامة:
    shad0w ~/ [#]
    رد: كود ايقونات تواصل الاجتماعي

    الله يقويك على الكود
    تم حفظه
     
  7. fayzoun

    fayzoun Developer

    الأنتساب:
    ‏14 يونيو 2015
    المشاركات:
    51
    الإعجابات المتلقاة:
    1
    نقاط الجائزة:
    8
    رد: كود ايقونات تواصل الاجتماعي

    شكرا موضوع مميز أخي...​


     

مشاركة هذه الصفحة