chatالمواضيع الأخيرة
مواضيع مماثلة
أشخاص في صن سيت
مشاهدة المزيد

نُشر بواسطة:

نغم الحياة
نغم الحياة
النجمة الذهبيه 20%
النجمة الذهبيه 20%
تاريخ النشر:
الأربعاء 28 نوفمبر 2018 - 14:07
اسم الدولة : :
مصر
العمر :
24
عدد المساهمات :
311
المعجبون بمواضيعى :
13

كلمات دليلية:

كود نافبار احترافى بشكل مميز ومنزلق

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

كود الجافا :


الكود:

(function() {

  if (!window.FA) window.FA = {};
  if (FA.Nav) {
    if (window.console && console.warn) console.warn('FA.Nav has already been defined');
    return;
  }

  FA.Nav = {
 
    // TARGET NODES BY VERSION
    // PHPBB2  : .bodyline > table + table
    // PHPBB3  : #page-header .navlinks
    // PUNBB    : #pun-navlinks
    // INVISION : #submenu
    targetNode : '#page-header .navlinks',
 
    customNav : '', // custom navlinks
 
    keepDefault : true, // keep the default navlinks
    collapsible : true, // show hide button
 
 
    // offset states
    offsets : {
      tbVisible : {
        bottom : 30,
        top : '110px'
      },
   
      tbHidden : {
        bottom : 0,
        top : '0px'

      },
   
      toggler : '0px'
    },
 
    activeOffset : {}, // active offset for the sticky nav
 
    visible : true, // sticky nav is visible
 
    // check the state of the static nav
    checkState : function() {
      if (!FA.Nav.animating) {
        var hidden = FA.Nav.barStatic.getBoundingClientRect().bottom <= FA.Nav.activeOffset.bottom;
   
        if (hidden && FA.Nav.barSticky.style.top != FA.Nav.activeOffset.top) {
          if (FA.Nav.toggler) FA.Nav.toggler.style.top = FA.Nav.offsets.toggler;
          FA.Nav.barSticky.style.top = FA.Nav.activeOffset.top;
                      FA.Nav.barSticky.style.position = 'fixed';
FA.Nav.toggler.style.position = 'fixed';
          FA.Nav.visible = true;
        } else if (!hidden && FA.Nav.barSticky.style.top != '110px') {
          if (FA.Nav.toggler) FA.Nav.toggler.style.top = '110px';
            FA.Nav.barSticky.style.position = 'absolute';
FA.Nav.toggler.style.position = 'absolute';
          FA.Nav.barSticky.style.top = '110px';
                  FA.Nav.visible = false;
        }

      }
    },
 
    animating : false, // sticky nav is animating
 
    // animate the sticky nav when the toolbar is toggled
    animate : function() {
      if (FA.Nav.visible) {
        FA.Nav.animating = true;
        FA.Nav.barSticky.style.transition = 'none';
   
        $(FA.Nav.barSticky).animate({
          top : FA.Nav.activeOffset.top
        }, function() {
          FA.Nav.barSticky.style.transition = '';
          FA.Nav.animating = false;
          FA.Nav.checkState();
        });
      }
    },
 
    // toggle sticky navigation and remember preference via cookies
    toggle : function() {
      if (FA.Nav.barSticky.style.width == '100%') {
        my_setcookie('fa_sticky_nav', 'hidden');
        FA.Nav.barSticky.style.width = '0%';
      } else {
        my_setcookie('fa_sticky_nav', 'shown');
        FA.Nav.barSticky.style.width = '100%';
      }
      return false;
    }
 
  };
 
  $(function() {
    // set default offsets based on toolbar state
    FA.Nav.activeOffset = (my_getcookie('toolbar_state') == 'fa_hide' || !_userdata.activate_toolbar) ? FA.Nav.offsets.tbHidden : FA.Nav.offsets.tbVisible;
    if (!_userdata.activate_toolbar) FA.Nav.offsets.toggler = '0px';
 
    // find the static nav
    FA.Nav.barStatic = document.querySelector ? document.querySelector(FA.Nav.targetNode) : $(FA.Nav.targetNode)[0]; // static nav
 
    if (FA.Nav.barStatic) {
      FA.Nav.barSticky = FA.Nav.barStatic.cloneNode(FA.Nav.keepDefault); // clone static nav
      if (FA.Nav.customNav) FA.Nav.barSticky.insertAdjacentHTML('beforeEnd', FA.Nav.customNav);
      FA.Nav.barSticky.id = 'fa_sticky_nav';
      FA.Nav.barSticky.style.width = my_getcookie('fa_sticky_nav') == 'hidden' ? '0%' : '100%';
      FA.Nav.barSticky.style.top = '0px';
       
      document.body.appendChild(FA.Nav.barSticky); // append the sticky one
       
      // sticky nav toggler
      if (FA.Nav.collapsible) {
        FA.Nav.toggler = document.createElement('A');
        FA.Nav.toggler.id = 'fa_sticky_toggle';
        FA.Nav.toggler.href = '#';
        FA.Nav.toggler.style.top = '0px';
        FA.Nav.toggler.onclick = FA.Nav.toggle;
       
        document.body.appendChild(FA.Nav.toggler);
      };
     
      window.onscroll = FA.Nav.checkState; // check state on scroll
      FA.Nav.checkState(); // startup check
   
      // toolbar modifications
      $(function() {
        // animate sticky nav and change offsets when the toolbar is toggled
        $('#fa_hide').click(function() {
          FA.Nav.activeOffset = FA.Nav.offsets.tbHidden;
          FA.Nav.animate();
        });
     
        $('#fa_show').click(function() {
          FA.Nav.activeOffset = FA.Nav.offsets.tbVisible;
          FA.Nav.animate();
        });
      });
    }
  });
}());


كود الـCss: مخفي للرد كود نافبار احترافى بشكل مميز ومنزلق 3464847357



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

نُشر بواسطة:

العراقي الطائي
العراقي الطائي
ثلاثه نجوم فضيات 20%
ثلاثه نجوم فضيات 20%
تاريخ النشر:
الأربعاء 9 سبتمبر 2020 - 5:30
اسم الدولة : :
germany
العمر :
51
عدد المساهمات :
170
المعجبون بمواضيعى :
0

كلمات دليلية:

رد: كود نافبار احترافى بشكل مميز ومنزلق

رائع