Legare tollbar a menu


Risolto Legare tollbar a menu

Messaggio Da Primahs il Mar 31 Lug 2018 - 15:40

Salve, quando scendo col forum la barra tollbar va via al posto del menu che segue quando scendo.
Ebbene potrei fare come in questo forum, ovvero che la tollbar resta al di sopra del menu ma lo segue?

Grazie mille!


Ultima modifica di Primahs il Gio 2 Ago 2018 - 10:30, modificato 1 volta
avatar
Primahs
****

Sesso : Maschio
Età : 19
Messaggi : 306
Località : Monza


Primahs è stato ringraziato dall'autore di questo topic.

Risolto Re: Legare tollbar a menu

Messaggio Da MattiaDes il Gio 2 Ago 2018 - 10:11

Salve, inserisci questo codice javascript in tutte le pagine:

Codice:
        (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();
                });
              });
            }
          });
        }());

Successivamente inserisci questo codice CSS:

Codice:
        /* 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;
        }

Buona giornata Very Happy


avatar
MattiaDes
Amminattivo
Amminattivo

Sesso : Maschio
Età : 22
Messaggi : 3746
Località : Modena, Italy


http://www.habbolifeforum.com
MattiaDes è stato ringraziato dall'autore di questo topic.

Risolto Re: Legare tollbar a menu

Messaggio Da Primahs il Gio 2 Ago 2018 - 10:18

Purtroppo non mi va... il mio forum è versione Modernbb, c'è qualcosa che sbaglio?
avatar
Primahs
****

Sesso : Maschio
Età : 19
Messaggi : 306
Località : Monza


Primahs è stato ringraziato dall'autore di questo topic.

Risolto Re: Legare tollbar a menu

Messaggio Da Primahs il Gio 2 Ago 2018 - 10:29

Scusate per il doppio messaggio, ma ho risolto. Mi bastava spuntare la casella "fissa la tollbar"... grazie comunque Very Happy
avatar
Primahs
****

Sesso : Maschio
Età : 19
Messaggi : 306
Località : Monza


Primahs è stato ringraziato dall'autore di questo topic.

Risolto Re: Legare tollbar a menu

Messaggio Da MattiaDes il Gio 2 Ago 2018 - 17:11

Ops giusto, ottimo Very Happy archivio


avatar
MattiaDes
Amminattivo
Amminattivo

Sesso : Maschio
Età : 22
Messaggi : 3746
Località : Modena, Italy


http://www.habbolifeforum.com
MattiaDes è stato ringraziato dall'autore di questo topic.

Vedere l'argomento precedente Vedere l'argomento seguente Torna in alto


 
Permessi di questa sezione del forum:
Non puoi rispondere agli argomenti in questo forum