منتدى الدعم العربي لمنتديات أحلى منتدى
مرحبا بك في منتدى دعم منتديات AhlaMontada

لتتمكن من الإستمتاع بكافة ما يوفره لك هذا المنتدى من خصائص, يجب عليك أن تسجل الدخول الى حسابك في المنتدى. إن لم يكن لديك حساب بعد, نتشرف بدعوتك لإنشائه.

انشاء منتدى مجاني شبيه بهذا المنتدى

مشكلة اندسال قائمة ازرار المنتدى

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

تم الحل مشكلة اندسال قائمة ازرار المنتدى

مُساهمة من طرف YaSsin MiKa في السبت 11 يونيو 2016 - 6:31

آلسلآم عليكم ورحمة الله ..


لقد أعجبتني خاصية في منتدى الدعم الفرنسي وهي اندسال قائمة ازرار المنتدى عند النزول إلى اسفل الصفحة الموجودة في الموقع التالي


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


لقد ركبت الكود ولم يجدي اي نفع ربما أخطأت بأمر معين لذا المطلوب ترجمة الموضوع بالرابط بالاعلى وكيفية التركيب الصحيحة    Like a Star @ heaven


وسيكون افضل ان تمت ترجمت الموضوع وتنسيقه و وضعه في التقنيات المتقدمة لتعم الفائدة على الجميع  Laughing  Cool


وشكرا لكم مقدما  silent


عدل سابقا من قبل new.moon في السبت 11 يونيو 2016 - 23:52 عدل 2 مرات (السبب : يرجى عدم تغير عنوان الموضوع ليتسنى لغيرك البحث على نفس المشكلة)

YaSsin MiKa



ذكر
عدد المساهمات : 28
معدل النشاط : 723

http://diff.dbzworld.org/

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

تم الحل رد: مشكلة اندسال قائمة ازرار المنتدى

مُساهمة من طرف YaSsin MiKa في السبت 11 يونيو 2016 - 6:55

وهذه صورة لما أُشير إليه ،،


YaSsin MiKa



ذكر
عدد المساهمات : 28
معدل النشاط : 723

http://diff.dbzworld.org/

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

تم الحل رد: مشكلة اندسال قائمة ازرار المنتدى

مُساهمة من طرف {عذآب} في السبت 11 يونيو 2016 - 7:56

اهلاً اخي ما نسخة منتداك؟

{عذآب}
أحلى مساعدة
أحلى  مساعدة

ذكر
عدد المساهمات : 3077
معدل النشاط : 6249

http://www.quran-jed.net/index.php/component/muscol/Z/97-/85-/14

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

تم الحل رد: مشكلة اندسال قائمة ازرار المنتدى

مُساهمة من طرف YaSsin MiKa في السبت 11 يونيو 2016 - 8:23

phpBB2


YaSsin MiKa



ذكر
عدد المساهمات : 28
معدل النشاط : 723

http://diff.dbzworld.org/

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

تم الحل رد: مشكلة اندسال قائمة ازرار المنتدى

مُساهمة من طرف YaSsin MiKa في السبت 11 يونيو 2016 - 20:08

UP

YaSsin MiKa



ذكر
عدد المساهمات : 28
معدل النشاط : 723

http://diff.dbzworld.org/

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

تم الحل رد: مشكلة اندسال قائمة ازرار المنتدى

مُساهمة من طرف وهبة الساحر في السبت 11 يونيو 2016 - 20:35

مرحبا,

انت لم تختار اى لون عموما هذا اللون الابيض

ادخل الى الجافا وضع هذا الكود فى جميع الصفحات

الرمز:

(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 POUR CHAQUE VERSION
        // PHPBB2  : ".bodyline > table + table"
        // PHPBB3  : "#page-header .navlinks"
        // PUNBB    : "#pun-navlinks"
        // INVISION : "#submenu"
        targetNode : ".bodyline > table + table",
       
        customNav : '', // custom navlinks
       
        keepDefault : true, // keep the default navlinks
        collapsible : true, // show hide button
       
       
        // offset states
        offsets : {
          tbVisible : {
            bottom : 30,
            top : '30px'
          },
         
          tbHidden : {
            bottom : 0,
            top : '0px'
          },
         
          toggler : '30px'
        },
       
        activeOffset : {}, // active offset for the sticky nav
       
        visible : false, // 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.visible = true;
            } else if (!hidden && FA.Nav.barSticky.style.top != '-30px') {
              if (FA.Nav.toggler) FA.Nav.toggler.style.top = '-30px';
              FA.Nav.barSticky.style.top = '-30px';
              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) {
          $(function() {
            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 = '-30px';
             
            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 = '-30px';
              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
             
            // 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 وضع هذا الكود وهو بللون الابيض
الرمز:
 /* sticky nav main */
    #fa_sticky_nav {
      font-size:0; /* hide whitespace */
      text-align:center;
      background:#FAFAFA;
      border-bottom:1px solid #CCC !important;
      height:30px;
      position:fixed;
      right:0;
      z-index:999;
      overflow:hidden;
      transition:top 200ms linear, width 600ms ease-in-out;
    }
    
    #fa_sticky_nav li { display:inline } /* navlist adjustment */
    
    
    /* sticky menu links */
    #fa_sticky_nav a.mainmenu {
      color:#39C;
      font-size:12px;
      font-weight:bold;
      font-family:"Trebuchet MS", Arial, Verdana, Sans-serif;
      background:url('http://i18.servimg.com/u/f18/18/45/41/65/nav10.png') repeat-x 0px 30px;
      display:inline-block;
      padding:0 10px;
      height:30px;
      line-height:30px;
      transition:200ms;
    }
    
    #fa_sticky_nav a.mainmenu:hover, #fa_sticky_nav a.mainmenu.fa_navactif {
      background-position:0 25px;
    }
    
    
    /* sticky nav toggler */
    #fa_sticky_toggle {
      background:url('http://i21.servimg.com/u/f21/18/21/41/30/omnibo10.png') no-repeat 0 0 #FAFAFA;
      border:1px solid #CCC;
      border-right:none;
      display:inline-block;
      height:29px;
      width:30px;
      position:fixed;
      right:0;
      z-index:999;
      transition:top 200ms linear;
    }
    
    #fa_sticky_toggle:hover { background-position:-30px 0 }
    
    
    /* make hidden toolbar similar to toggler */
    #fa_toolbar_hidden {
      border-radius:0 !important;
      border:1px solid #CCC;
      border-right:0;
      border-top:0;
    }
    
    
    /* post offset fix */
    .post div[style*="-30px;"] {
      top:-60px !important;
    }

Cool

وهبة الساحر
 
 

ذكر
عدد المساهمات : 9500
معدل النشاط : 11460

http://3arb-way.a7larab.net/

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

تم الحل رد: مشكلة اندسال قائمة ازرار المنتدى

مُساهمة من طرف YaSsin MiKa في السبت 11 يونيو 2016 - 20:59

لقد وضعته من قبل ولاكن لا يوجد أي ثأتير ظاهر على المنتدى

YaSsin MiKa



ذكر
عدد المساهمات : 28
معدل النشاط : 723

http://diff.dbzworld.org/

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

تم الحل رد: مشكلة اندسال قائمة ازرار المنتدى

مُساهمة من طرف new.moon في السبت 11 يونيو 2016 - 22:36

مرحباً بك عزيزي
تم تعديل الكود ليتناسب مع نسخة 2
تفضل
الرمز:
(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 POUR CHAQUE VERSION
    // PHPBB2  : ".bodyline > table + table"
    // PHPBB3  : "#page-header .navlinks"
    // PUNBB    : "#pun-navlinks"
    // INVISION : "#submenu"
    targetNode : ".bodyline > table + table",
    
    customNav : '', // custom navlinks
    
    keepDefault : true, // keep the default navlinks
    collapsible : true, // show hide button
    
    
    // offset states
    offsets : {
      tbVisible : {
        bottom : 30,
        top : '30px'
      },
      
      tbHidden : {
        bottom : 0,
        top : '0px'
      },
      
      toggler : '30px'
    },
    
    activeOffset : {}, // active offset for the sticky nav
    
    visible : false, // 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.visible = true;
        } else if (!hidden && FA.Nav.barSticky.style.top != '-30px') {
          if (FA.Nav.toggler) FA.Nav.toggler.style.top = '-30px';
          FA.Nav.barSticky.style.top = '-30px';
          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) {
      $(function() {
        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 = '-30px';
          
        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 = '-30px';
          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
          
        // 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();
        });
      });
    }
  });
}());

كيف تم ذالك ..

في الشرح لقد وضح لك الكود المقتبس التالي من الكود الاصلي
// TARGET NODES BY VERSION
   // PHPBB2  : .bodyline > table + table
   // PHPBB3  : #page-header .navlinks
   // PUNBB    : #pun-navlinks
   // INVISION : #submenu
   targetNode : '.bodyline > table + table',

اللون الاحمر كل نسخة ولها المتغير الخاص بها ومحددهالك انا باللون الاحمر ووضع قبلها // يعني كومنت هذه فقط كتابه لا تأثير في الأسفل اللون الاخضر هو المتغير الخاص بالنسخه الثالثة ولتقوم بتغيرها عليك بنسخ المتغيرات بالاعلى كل نسخه ومتغيرها الخاص 
مثلاً الان محدد التالي
   targetNode : '#page-header .navlinks',
الخاص بالنسخه الثالثة لكي يعمل على النسخة الثانية عليك بتغير الكود اللون الاخضر وليصبح كالتالي
   targetNode : '.bodyline > table + table',
وهكذا كل نسخه ومتغيرتها الخاصة الموضحة في الكود  Wink

new.moon
أحلى إشراف
أحلى  إشراف

ذكر
عدد المساهمات : 10713
معدل النشاط : 12147

http://yasirayad.com/

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

تم الحل تم الحل

مُساهمة من طرف YaSsin MiKa في السبت 11 يونيو 2016 - 22:46

@وهبة الساحر :: شكرا لك عمل الكود على منتدى تجريبي يبدو ان المشكلة عندي بالتومبيلات ،، شكرا لك مجددا



@new.moon :: شكرا لك جدا لقد اوضحت لي كيف اركب الكود لنسخة اخرى عدا الـ phpBB2 واشكرك مرة اخرى .



...

شكرا لكما اخواني الأعزاء على الجهد المبذول  Cool Cool :تحية مع الشكر:

تم الحل 

YaSsin MiKa



ذكر
عدد المساهمات : 28
معدل النشاط : 723

http://diff.dbzworld.org/

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

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


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