| كود تثبيت الناف أعلى المتصفح | |
|
|
|
كاتب الموضوع | رسالة |
---|
keko_ferkeko
عدد المساهمات : 586 معدل النشاط : 6444 السُمعة : 1
| موضوع: كود تثبيت الناف أعلى المتصفح الثلاثاء 5 يوليو 2016 - 21:07 | |
| بسم الله الرحمن الرحيم السلام عليكم و رحمة الله و بركاته أبحث عن كود تثبيت عارضة المنتدى (ناف بار) في أعلى المتصفحة عند التحرك لأسفل الصفحة. نسخة المنتدى PHPBB3
خالص التحية؛ | |
|
| |
Michael_vx
عدد المساهمات : 1066 معدل النشاط : 7998 السُمعة : 69
| موضوع: رد: كود تثبيت الناف أعلى المتصفح الأربعاء 6 يوليو 2016 - 1:31 | |
| اولا اختر احد كودين الورقة واضفة الى ورقة التصميم 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; } الثانى غامق اللون - الكود:
-
/* مايكل سوفت sticky nav main */ #fa_sticky_nav { font-size:0; /* hide whitespace */ text-align:center; background:#333; border-bottom:1px solid #222 !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:#CCC; font-size:12px; font-weight:bold; font-family:"Trebuchet MS", Arial, Verdana, Sans-serif; background:url('http://i21.servimg.com/u/f21/18/21/41/30/row10.gif') 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 { color:#FFF; background-position:0 25px; }
/* sticky nav toggler */ #fa_sticky_toggle { background:url('http://i21.servimg.com/u/f21/18/21/41/30/omnida11.png') no-repeat 0 0 #333; border:1px solid #222; 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 #222; border-right:0; border-top:0; }
/* post offset fix */ .post div[style*="-30px;"] { top:-60px !important; } ثم اضف الكود التالى فى الجافا سكربت هذا الكود مخصص للنسخة الثالثة - الكود:
-
(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 : '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) { 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 // 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(); }); }); } }); }()); مع تحياتى مايكل سوفت | |
|
| |
keko_ferkeko
عدد المساهمات : 586 معدل النشاط : 6444 السُمعة : 1
| موضوع: رد: كود تثبيت الناف أعلى المتصفح الأربعاء 6 يوليو 2016 - 5:11 | |
| شكراً مايكل على المساعدة للأسف الكود لم يعمل! لا أعرف بالظبط ما المشكلة.. لكني جربت كل الأكواد المكتوبة و لم تفلح | |
|
| |
assemDz
عدد المساهمات : 159 معدل النشاط : 5761 السُمعة : 15
| موضوع: رد: كود تثبيت الناف أعلى المتصفح الأربعاء 6 يوليو 2016 - 6:10 | |
| اهلا اخي تفضل جرب هذا الكود CSS : - الكود:
-
.fa_fix { position: fixed !important; top: 0; right: 0; }
| |
|
| |
keko_ferkeko
عدد المساهمات : 586 معدل النشاط : 6444 السُمعة : 1
| موضوع: رد: كود تثبيت الناف أعلى المتصفح الأربعاء 6 يوليو 2016 - 7:05 | |
| شكراً عاصم لكن الكود لا يعمل | |
|
| |
JoryAbdallah
عدد المساهمات : 3029 معدل النشاط : 8415 السُمعة : 295
| موضوع: رد: كود تثبيت الناف أعلى المتصفح الأربعاء 6 يوليو 2016 - 8:05 | |
| وعليكم السلام ورحمة الله وبركاته بدون كود يمكنك ثبيتها من خلال لوحة الإدارة >> عناصر إضافية >> عارضة المنتدى >> تشكيل >> تفعيل عارضة المنتدى مع إمكانية جعلها ثابتة في أعلى المتصفح بشكل صورة للامر دمت بخير | |
|
| |
keko_ferkeko
عدد المساهمات : 586 معدل النشاط : 6444 السُمعة : 1
| موضوع: رد: كود تثبيت الناف أعلى المتصفح الأربعاء 6 يوليو 2016 - 8:21 | |
| شكراً جرح على المساعدة.. أنا كنت أقصد الناف بار و ليس عارضة المنتدى، يعني أقصد شريط (المنتدى - البوابة - التسجيل - الدخول..)
عيدك سعيد | |
|
| |
JoryAbdallah
عدد المساهمات : 3029 معدل النشاط : 8415 السُمعة : 295
| موضوع: رد: كود تثبيت الناف أعلى المتصفح الأربعاء 6 يوليو 2016 - 9:21 | |
| اهاا عذرا اخي لم انتبه تفضل هنا - 0marp0p23 كتب:
- اضف كود الجافا التالي في جميع الصفح
- الكود:
-
(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 : '.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) { 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 // 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 التالي في ورقة ال 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; } للون الاسود أضف هذا الكود (للمعاينة) - الكود:
-
/* sticky nav main */ #fa_sticky_nav { font-size:0; /* hide whitespace */ text-align:center; background:#333; border-bottom:1px solid #222 !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:#CCC; font-size:12px; font-weight:bold; font-family:"Trebuchet MS", Arial, Verdana, Sans-serif; background:url('http://i21.servimg.com/u/f21/18/21/41/30/row10.gif') 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 { color:#FFF; background-position:0 25px; } /* sticky nav toggler */ #fa_sticky_toggle { background:url('http://i21.servimg.com/u/f21/18/21/41/30/omnida11.png') no-repeat 0 0 #333; border:1px solid #222; 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 #222; border-right:0; border-top:0; } /* post offset fix */ .post div[style*="-30px;"] { top:-60px !important; } | |
|
| |
assemDz
عدد المساهمات : 159 معدل النشاط : 5761 السُمعة : 15
| موضوع: رد: كود تثبيت الناف أعلى المتصفح الأربعاء 6 يوليو 2016 - 9:49 | |
| اهلا أخي : عيدكم مبارك تفضل هاهو الكود : ضع هذا في الجافا سكريبت : - الكود:
-
$("document").ready(function($){ var nav = $('a.mainmenu');
$(window).scroll(function () { if ($(this).scrollTop() > 125) { nav.addClass("assemDz"); } else { nav.removeClass("assemDz"); } }); });
ثم توجه الى ورقة css : - الكود:
-
.assemDz{ z-index: 999; position: fixed; left: 0; top: 0; width: 100%; }
تحياتي | |
|
| |
MSCFC
عدد المساهمات : 74 معدل النشاط : 3279 السُمعة : 4
| موضوع: رد: كود تثبيت الناف أعلى المتصفح الأربعاء 6 يوليو 2016 - 11:41 | |
| | |
|
| |
keko_ferkeko
عدد المساهمات : 586 معدل النشاط : 6444 السُمعة : 1
| موضوع: رد: كود تثبيت الناف أعلى المتصفح الأربعاء 6 يوليو 2016 - 12:45 | |
| - JAR7 كتب:
- اهاا عذرا اخي لم انتبه
تفضل هنا
- 0marp0p23 كتب:
- اضف كود الجافا التالي في جميع الصفح
- الكود:
-
(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 : '.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) { 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 // 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 التالي في ورقة ال 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; } للون الاسود أضف هذا الكود (للمعاينة) - الكود:
-
/* sticky nav main */ #fa_sticky_nav { font-size:0; /* hide whitespace */ text-align:center; background:#333; border-bottom:1px solid #222 !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:#CCC; font-size:12px; font-weight:bold; font-family:"Trebuchet MS", Arial, Verdana, Sans-serif; background:url('http://i21.servimg.com/u/f21/18/21/41/30/row10.gif') 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 { color:#FFF; background-position:0 25px; } /* sticky nav toggler */ #fa_sticky_toggle { background:url('http://i21.servimg.com/u/f21/18/21/41/30/omnida11.png') no-repeat 0 0 #333; border:1px solid #222; 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 #222; border-right:0; border-top:0; } /* post offset fix */ .post div[style*="-30px;"] { top:-60px !important; } أيضاً لا يعمل.. أعتقد أنه الـCSS .. لأن هذه الأسماء ليست موجودة في النسخة الثالثة.. و لم يتغير شكل الـبار. عموماً شكراً لك. - assemDz كتب:
- اهلا أخي :
عيدكم مبارك تفضل هاهو الكود :
ضع هذا في الجافا سكريبت :
- الكود:
-
$("document").ready(function($){ var nav = $('a.mainmenu');
$(window).scroll(function () { if ($(this).scrollTop() > 125) { nav.addClass("assemDz"); } else { nav.removeClass("assemDz"); } }); });
ثم توجه الى ورقة css :
- الكود:
-
.assemDz{ z-index: 999; position: fixed; left: 0; top: 0; width: 100%; }
تحياتي الكود يعمل.. لكن كل الأزرار فوق بعضها! | |
|
| |
Michael_vx
عدد المساهمات : 1066 معدل النشاط : 7998 السُمعة : 69
| موضوع: رد: كود تثبيت الناف أعلى المتصفح الأربعاء 6 يوليو 2016 - 14:03 | |
| - keko_ferkeko كتب:
- شكراً مايكل على المساعدة
للأسف الكود لم يعمل! لا أعرف بالظبط ما المشكلة.. لكني جربت كل الأكواد المكتوبة و لم تفلح اولا عليك باخذ كود CSS واحد فقط على حسب تفضيلك ثانيا كود الجافا سكربت فى اى مكان الجافا سكربت لا تضع جميع الاكواد لم اقل ضع جميع الاكواد انت بذلك ستعطل عملها فى ورقة ال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; } اما اذا كنت تريد اللون الغامق (اسود او رمادى) فلا تضع الكود السابق واضف التالى - الكود:
-
/* مايكل سوفت sticky nav main */ #fa_sticky_nav { font-size:0; /* hide whitespace */ text-align:center; background:#333; border-bottom:1px solid #222 !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:#CCC; font-size:12px; font-weight:bold; font-family:"Trebuchet MS", Arial, Verdana, Sans-serif; background:url('http://i21.servimg.com/u/f21/18/21/41/30/row10.gif') 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 { color:#FFF; background-position:0 25px; }
/* sticky nav toggler */ #fa_sticky_toggle { background:url('http://i21.servimg.com/u/f21/18/21/41/30/omnida11.png') no-repeat 0 0 #333; border:1px solid #222; 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 #222; border-right:0; border-top:0; }
/* post offset fix */ .post div[style*="-30px;"] { top:-60px !important; } ثم فى الجافا سكربت اضف التالى فى ادارة اكواد الجافا سكربت - الكود:
-
(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 : '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) { 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 // 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(); }); }); } }); }()); تاكد انك حذفت الاكواد القديمة ثم جرب اذا لم يعمل ارفق رابط منتداك ولا تغير شىء لحين اتمام فحص المنتدى ومعرفة نوعيه الخطاء الذى يعطل الكود | |
|
| |
keko_ferkeko
عدد المساهمات : 586 معدل النشاط : 6444 السُمعة : 1
| موضوع: رد: كود تثبيت الناف أعلى المتصفح الأربعاء 6 يوليو 2016 - 14:33 | |
| | |
|
| |
Michael_vx
عدد المساهمات : 1066 معدل النشاط : 7998 السُمعة : 69
| موضوع: رد: كود تثبيت الناف أعلى المتصفح الأربعاء 6 يوليو 2016 - 14:39 | |
| يوجد مشكلة فى هذا الجزىء اعتقد انه مضاف بواستطك انت http://nf-son.yoo7.com/99364.js - الكود:
-
(function(){'DEVELOPED BY ANGE TUTEUR';'NO DISTRIBUTION WITHOUT CONSENT OF THE AUTHOR';'ORIGIN : http://fmdesign.forumotion.com/t530-simple-theme-changer#7800';var version=1;window.fa_theme_color={version:version,delay:500,transition:1000,transition_all:false,attachTo:['.bodyline > table:first-child','#page-header','#pun-head','#submenu'][version],selected:my_getcookie('fa_theme_color')||'Select a theme',palette:{'Select a theme':'','Random theme':[],'Rainbow':'','Persian Red':['#D44','#C33','#B22','#900','#522'],'Chestnut Rose':['#D77','#C66','#B55','#933','#533'],'Eunry':['#DAA','#C99','#B88','#966','#544'],'Tuscany':['#D64','#C63','#B52','#930','#532'],'Antique Brass':['#DA7','#C96','#B85','#963','#543'],'Hokey Pokey':['#DA4','#C93','#B82','#960','#542'],'Earls Green':['#DD4','#CC3','#BB2','#990','#552'],'Laser':['#DD7','#CC6','#BB5','#993','#553'],'Pine Glade':['#DDA','#CC9','#BB8','#996','#554'],'Celery':['#AD4','#9C3','#8B2','#690','#452'],'Wild Willow':['#AD7','#9C6','#8B5','#693','#453'],'Atlantis':['#7D4','#6C3','#5B2','#390','#352'],'Apple':['#4D4','#3C3','#2B2','#090','#252'],'Mantis':['#7D7','#6C6','#5B5','#393','#353'],'De York':['#ADA','#9C9','#8B8','#696','#454'],'Mountain Meadow':['#4D7','#3C6','#2B5','#093','#253'],'Emerald':['#7DA','#6C9','#5B8','#396','#354'],'Shamrock':['#4DA','#3C9','#2B8','#096','#254'],'Turquoise':['#4DD','#3CC','#2BB','#099','#255'],'Downy':['#7DD','#6CC','#5BB','#399','#355'],'Sinbad':['#ADD','#9CC','#8BB','#699','#455'],'Curious Blue':['#4AD','#39C','#28B','#069','#245'],'Danube':['#7AD','#69C','#58B','#369','#345'],'Mariner':['#47D','#36C','#25B','#039','#235'],'Governor Bay':['#44D','#33C','#22B','#009','#225'],'Blue Marguerite':['#77D','#66C','#55B','#339','#335'],'Blue Bell':['#AAD','#99C','#88B','#669','#445'],'Purple Heart':['#74D','#63C','#52B','#309','#325'],'Amethyst':['#A7D','#96C','#85B','#639','#435'],'Purple':['#A4D','#93C','#82B','#609','#425'],'Cerise':['#D4D','#C3C','#B2B','#909','#525'],'Fuchsia Pink':['#D7D','#C6C','#B5B','#939','#535'],'Lilac':['#DAD','#C9C','#B8B','#969','#545'],'Red Violet':['#D4A','#C39','#B28','#906','#524'],'Hopbush':['#D7A','#C69','#B58','#936','#534'],'Hibiscus':['#D47','#C36','#B25','#903','#523']},change:function(color,select){var head=$('head'),style=document.getElementById('fa_theme_style');my_setcookie('fa_theme_color',color);if(style){head[0].removeChild(style)} يبدو انه السبب الرئيسى فى عدم تفعيل الكود الخاص بالناف بار | |
|
| |
Michael_vx
عدد المساهمات : 1066 معدل النشاط : 7998 السُمعة : 69
| موضوع: رد: كود تثبيت الناف أعلى المتصفح الأربعاء 6 يوليو 2016 - 15:00 | |
| اذا لم تكن قادرا على الوصول الى الخطاء الذى اراه فى الفحص قم بتفعيل عضويتى ومنحها صلاحيه الدخول للوحة الادارة وسابحث عن الكود بنفسى هذا اذا كنت تريد هذا الاختيار ليس اجباريا | |
|
| |
keko_ferkeko
عدد المساهمات : 586 معدل النشاط : 6444 السُمعة : 1
| موضوع: رد: كود تثبيت الناف أعلى المتصفح الخميس 7 يوليو 2016 - 8:25 | |
| أشكرك كثيراً على التعاون.. تم تفعيل عضويتك.. أرجو أن تستطيع حل هذه المشكلة. | |
|
| |
Michael_vx
عدد المساهمات : 1066 معدل النشاط : 7998 السُمعة : 69
| موضوع: رد: كود تثبيت الناف أعلى المتصفح الخميس 7 يوليو 2016 - 18:36 | |
| | |
|
| |
Michael_vx
عدد المساهمات : 1066 معدل النشاط : 7998 السُمعة : 69
| موضوع: رد: كود تثبيت الناف أعلى المتصفح الخميس 7 يوليو 2016 - 18:57 | |
| العيب ليس من عندك فى المنتدى اخى الحبيب العيب من نقل الكود من الدعم هنا هندما اسحب الكود نسخ لصق والذى اضعه بالرد هنا لا يعمل وعندما اسحب الكود من موقعى نسخ لصق الى منتداك فانه يعمل ويمكنك رؤية النتيجة بنفسك تحياتى لك | |
|
| |
SaLEm Hen!CHE
عدد المساهمات : 567 معدل النشاط : 7087 السُمعة : 60
| موضوع: رد: كود تثبيت الناف أعلى المتصفح الخميس 7 يوليو 2016 - 19:01 | |
| السلام عليكم ، بعد إذن السادة أعلاه @keko_ferkekoتفضل غير كود الجافا الحالي بهذا : : - الكود:
-
(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 : '30px' }, tbHidden : { bottom : 0, top : '0px' }, toggler : '30px' }, 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.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) { 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 // 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(); }); }); } }); }()); | |
|
| |
keko_ferkeko
عدد المساهمات : 586 معدل النشاط : 6444 السُمعة : 1
| موضوع: رد: كود تثبيت الناف أعلى المتصفح الخميس 7 يوليو 2016 - 20:50 | |
| - Michael_vx كتب:
- العيب ليس من عندك فى المنتدى اخى الحبيب
العيب من نقل الكود من الدعم هنا هندما اسحب الكود نسخ لصق والذى اضعه بالرد هنا لا يعمل وعندما اسحب الكود من موقعى نسخ لصق الى منتداك فانه يعمل ويمكنك رؤية النتيجة بنفسك تحياتى لك كنت أكاد أن أجن .. شكراً على تعبك معايا.. هناك مشكلة أخيرة أن العارضة تظهر مرتين في الصفحة! كيف أخفي واحدة منهم؟ - SaLEm Hen!CHE كتب:
- السلام عليكم ،
بعد إذن السادة أعلاه @keko_ferkeko تفضل غير كود الجافا الحالي بهذا : : - الكود:
-
(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 : '30px' }, tbHidden : { bottom : 0, top : '0px' }, toggler : '30px' }, 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.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) { 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 // 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(); }); }); } }); }()); أشكرك كثيراً.. لكن من الواضح أن الكود في مشكلة لإنه نفس الكود في أعلى و ما تزال العارضة تظهر مرتين في الصفحة! | |
|
| |
SaLEm Hen!CHE
عدد المساهمات : 567 معدل النشاط : 7087 السُمعة : 60
| موضوع: رد: كود تثبيت الناف أعلى المتصفح الخميس 7 يوليو 2016 - 20:58 | |
| طيب ، هذا لجعلها ثابتة تبقى في مكانها في الاعلى عند النزول : غير كود الـــ 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:absolute; 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:absolute; 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; }
... يمكنك إخبارنا بالمكان الذي تريد تثبيت الناف بار به | |
|
| |
keko_ferkeko
عدد المساهمات : 586 معدل النشاط : 6444 السُمعة : 1
| موضوع: رد: كود تثبيت الناف أعلى المتصفح الخميس 7 يوليو 2016 - 21:29 | |
| | |
|
| |
SaLEm Hen!CHE
عدد المساهمات : 567 معدل النشاط : 7087 السُمعة : 60
| موضوع: رد: كود تثبيت الناف أعلى المتصفح الخميس 7 يوليو 2016 - 21:44 | |
| طيب ... صف لي كيف تريده بالظبط حتى احاول جعله كما تريد لاني لم افهم ما تريد بالظبط ظننت انك تريد التثبيت فقط..؟ | |
|
| |
keko_ferkeko
عدد المساهمات : 586 معدل النشاط : 6444 السُمعة : 1
| موضوع: رد: كود تثبيت الناف أعلى المتصفح الخميس 7 يوليو 2016 - 22:32 | |
| - SaLEm Hen!CHE كتب:
- طيب ... صف لي كيف تريده بالظبط حتى احاول جعله كما تريد لاني لم افهم ما تريد بالظبط ظننت انك تريد التثبيت فقط..؟
أنا عارف إني تعبتكم معي كثيراً جداً كل ما أريده هو : عارضة المنتدى (ناف بار) في أعلى المتصفحة عند التحرك لأسفل الصفحة. خالص تحياتي؛ | |
|
| |
SaLEm Hen!CHE
عدد المساهمات : 567 معدل النشاط : 7087 السُمعة : 60
| موضوع: رد: كود تثبيت الناف أعلى المتصفح الخميس 7 يوليو 2016 - 22:50 | |
| تمام يا غالي ... ما رأيك الان .. عاين المنتدى الان ..؟ بخصوص الناف بار الاصلي سأنزعه لا مشكلة .. | |
|
| |
| كود تثبيت الناف أعلى المتصفح | |
|