المواضيع الأخيرة
قم بالاعجاب لصفحة موقع صن سيت على الفيسبوك ليصلك كل جديد ...
اشخاص فى صن سيت
مشاهدة المزيد
المتواجدون الآن ؟
ككل هناك 14 عُضو متصل حالياً :: 0 عضو مُسجل, 0 عُضو مُختفي و 14 زائر :: 2 عناكب الفهرسة في محركات البحث

لا أحد

أكبر عدد للأعضاء المتواجدين في هذا المنتدى في نفس الوقت كان 1792 بتاريخ الأحد 29 يناير 2017 - 11:31
ألــــوان الرتــــب
الإدارة العليا
المدير العام
رئيس المشرفين
مشــــرف
عضــــو
اعلان ممول
هل صليت على النبي محمد صلى الله عليه وسلم . اليوم ؟




حصرى : جعل ازرار التصفح بشكل منبثق اكثر من خيال

استعرض الموضوع السابق استعرض الموضوع التالي اذهب الى الأسفل

حصرى : جعل ازرار التصفح بشكل منبثق اكثر من خيال

مُساهمة من طرف نغم الحياة في الأحد 24 يوليو 2016 - 22:34

حصرى : جعل ازرار التصفح بشكل منبثق اكثر من خيال
حصرى : جعل ازرار التصفح بشكل منبثق اكثر من خيال
حصرى : جعل ازرار التصفح بشكل منبثق اكثر من خيال
اقدم ليعونكم اليوم هذا الكود الفريد المحول بالعربية
صورة للكود :

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

كود الجافا :
الكود:

(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:
ضع رد مناسب





المصدر : منتدي الابداع العربي
avatar
نغم الحياة
النجمة الذهبيه
النجمة الذهبيه

اسم الدولة : : مصر
العمر : 21
عدد المساهمات : 257
المعجبون بمواضيعى : 7

معاينة صفحة البيانات الشخصي للعضو

الرجوع الى أعلى الصفحة اذهب الى الأسفل

رد: حصرى : جعل ازرار التصفح بشكل منبثق اكثر من خيال

مُساهمة من طرف gsm_bouali في الثلاثاء 1 أغسطس 2017 - 20:35

شكرا

avatar
gsm_bouali
النجمة الفضية 20%
النجمة الفضية 20%

اسم الدولة : : تونس
العمر : 40
عدد المساهمات : 16
المعجبون بمواضيعى : 0

معاينة صفحة البيانات الشخصي للعضو

الرجوع الى أعلى الصفحة اذهب الى الأسفل

استعرض الموضوع السابق استعرض الموضوع التالي الرجوع الى أعلى الصفحة


 
صلاحيات هذا المنتدى:
لاتستطيع الرد على المواضيع في هذا المنتدى

  • © phpBB | الحصول على منتدى | منتدى مجاني للدعم و المساعدة | إتصل بنا | التبليغ عن محتوى مخالف | انشئ مدونتك الخاصة
    الساعة الأن :