حالة الموضوع:
مغلق
  1. :: dev-vb ::

    :: dev-vb :: Developer

    الأنتساب:
    ‏7 مارس 2012
    المشاركات:
    21
    الإعجابات المتلقاة:
    0
    نقاط الجائزة:
    1
    ♥ السلام عليكم ورحمة الله و بركاته

    ~ عدنا لكم من جديد و دائما بالجديد ~ أتمنى أني ما أكون ثقلت عليكم

    ~ مشروع اليوم عبارة عن قائمة للمواقع الاجتماعية تكون ثابثة مع مميزات جوكيري رائعة

    ♥ كالعادة أترككم مع المثال المصور :


    [​IMG]

    ♥ يليه المثال الحي من هنا |~ على منتديات زيباره التطويرية


    ♥ نأتي لطريقة التركيب وهي كالتالي :

    [1] - ارفع مجل " social " الموجود في الملف المضغوط ( في المرفقات ) الى مجلد منتداك الرئيسي
    [2] - قم باضافة الكود التالي في نهاية قالب الــ headinclude ~

    كود PHP:
        <!-- main stylesheets --> 
        
        <!-- 
    Screen CSS -->
           <
    link rel="stylesheet" href="social/reset000.css" type="text/css" media="screen">

        <
    link rel="stylesheet" href="social/style000.css" type="text/css" media="screen">
        
        <!-- 
    Framework CSS -->
        <
    link rel="stylesheet" href="social/dpSocial.css">
        
        <!-- 
    import jQuery --> 
        <
    script type="text/javascript" src="social/jquery-1.js"></script>
        <script type="text/javascript" src="social/jquery00.js"></script>
                    
        <script type="text/javascript"> 
             $(document).ready(function(){
                $.dpSocialBar({
                    items: {
                        twitter: { url: 'http://twitter.com/', text: 'تابعنا على <strong>twitter</strong>' },
                        facebook: { url: 'http://facebook.com/', text: 'تابعنا عالـفيس بوك' },
                        flickr: { url: 'http://www.flickr.com', text: 'صفحتنا على الفلكر' },
                        skype: { url: 'http://www.skype.com', text: 'أضفنا على السكايبي' },
                        rss: { url: 'http://www.rss.com', text: 'RSS Feed' },
                        google: { url: 'http://www.google.com', text: 'صفحتنا على قوقل +' },
                        contact: { url: 'mailto:mailmail.com', text: 'راسل الادارة' },
                        youtube: { url: 'http://www.youtube.com', text: 'قناتنا على اليوتيوب' },
                        digg: { url: 'http://www.digg.com', text: 'Profile on digg' },
                        delicious: { url: 'http://www.delicious.com', text: 'Profile on delicious' },
                        tumblr: { url: 'http://www.tumblr.com', text: 'Profile on tumblr' },


                        picasa: { url: 'http://www.picasa.com', text: 'Profile on picasa' },
                        vimeo: { url: 'http://www.vimeo.com', text: 'Profile on vimeo' },
                        reddit: { url: 'http://www.reddit.com', text: 'Profile on reddit' },
                        technorati: { url: 'http://www.technorati.com', text: 'Profile on technorati' },
                    },
                    show: 5,
                    position: "bottom",
                    skin: "clear"
                });
                
            });
        </script>  
    [3] - نأتي الان لطريقة التحكم في استايل و مكان القائمة ~ :

    - كما نلاحظ في آخر الكود يوجد :

    كود PHP:
      position"bottom",
    يمكنك تغيير كلمة " buttom " والتي تعني الأسفل الى ~

    Right : اليمين
    left : اليسار
    top : الأعلى

    - و أيضا نلاحظ وجود :


    كود PHP:
     skin"clear"  
    يمكنك تغيير كلمة " clear " و التي تعني الثيم الابيض الفاتح الى ~

    dark : الثيم الاسود

    [DOWNLOAD][​IMG][/DOWNLOAD]

    اتنهى الشرح


    ♥ و لاتنسى تغيير الروابط الـى روابط متلائمة مع موقعك ~ تقبلو تحياتي


     
  2. boubisad

    boubisad Developer

    الأنتساب:
    ‏8 مارس 2012
    المشاركات:
    32
    الإعجابات المتلقاة:
    0
    نقاط الجائزة:
    6
    الإقامة:
    تونس الخضراء
    رد: [ jquery & Css ] : قائمة المواقع الاجتماعية بطريقة اكثر من رائعة

    يعطيـكك العاآفيـه اخـوٍي !!:{
     
حالة الموضوع:
مغلق

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