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

    :: dev-vb :: Developer

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

    السلام عليكم ورحمة الله و بركاته


    موضوعي الثاني في هذا القسم عبارة عن "
    قائمة علوية ثابثة مع مزايا جوكيري رائعة "


    ♥ في بادئ الأمر أترككم مع مميزات القائمة :

    - مكان ثابث في أعلى صفحة منتداك ~
    - اختفاء القائمة عند النزول إلى أسفل أو وسط الصفحة لعدم حجب الرؤية ~
    - القائمة تضم روابط على شكل أزرار بتقنية الــ CSS3 و زر العودة السريعة لأعلى الصفحة ~



    ♥ ثانيا أترككم مع المثال المصور :

    [​IMG]


    ♥ ثالثا نأتي للتركيب :


    ♥ أولا وقبل شيء يجب عليك رفع المجلد " topbar " الموجود داخل الملف الملف المرفق الى مجلد المنتدى الرئيسي

    ♥ ثانيا قم بااضافة الكود التالي باخر قالب " headinclude " :

    كود PHP:
    <link href="topbar/style.css" rel="stylesheet" type="text/css" /> 


    <
    script type="text/javascript"

    $(function() { 
        $(
    window).scroll(function(){ 
            var 
    scrollTop = $(window).scrollTop(); 
            if(
    scrollTop != 0
                $(
    '#nav').stop().animate({'opacity':'0.2'},400); 
            else 
                $(
    '#nav').stop().animate({'opacity':'1'},400); 
        }); 
      
        $(
    '#nav').hover
            function (
    e) { 
                var 
    scrollTop = $(window).scrollTop(); 
                if(
    scrollTop != 0){ 
                    $(
    '#nav').stop().animate({'opacity':'1'},400); 
                } 
            }, 
            function (
    e) { 
                var 
    scrollTop = $(window).scrollTop(); 
                if(
    scrollTop != 0){ 
                    $(
    '#nav').stop().animate({'opacity':'0.2'},400); 
                } 
            } 
        ); 
    });     
    </script>  
    ♥ أخيرا قم بأضافة الكود التالي بآخر قالب " header " :

    كود PHP:
    <div id="nav"
     <
    ul
      <
    li><class="top" href="#"><span></span></a></li
      <
    li><a> ::  ترايدنت  ::</a></li
      <
    li><a> ::  dev-vb  ::</a></li
      <
    li><a> ::  ترايدنت  ::</a></li
      <
    li><a> ::  dev-vb  ::</a></li
      <
    li><a> ::  ترايدنت  ::</a></li
      <
    li><a> ::  dev-vb  ::</a></li
        <
    li><a> ::  ترايدنت  ::</a></li


     </
    ul
    </
    div
    تحميل الاكواد
    [DOWNLOAD]
    [/DOWNLOAD]


    ♥ اذا أعجبك الموضوع لا تبخل على باعجاب أو تقييم

     
  2. ( xP )

    ( xP ) DeveloPer Plus

    الأنتساب:
    ‏10 مارس 2012
    المشاركات:
    132
    الإعجابات المتلقاة:
    2
    نقاط الجائزة:
    18
    الإقامة:
    IQ-TAM
    رد: [ شرح ] : عمل قائمة علوية ثابثة مع مزايا جوكيري رائعة

    تسلم يمينك ياحبيبي مجهود عظيم ألف شكر ياغالي
     
  3. مستريح البال

    مستريح البال Developer

    الأنتساب:
    ‏10 مارس 2012
    المشاركات:
    27
    الإعجابات المتلقاة:
    0
    نقاط الجائزة:
    1
    رد: [ شرح ] : عمل قائمة علوية ثابثة مع مزايا جوكيري رائعة

    بارك الله فيك ،
     
حالة الموضوع:
مغلق

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