Toolbar

[Thomas-Hilde]

Détails techniques

Version du forum : phpBB2
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Safari
Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : https://naggaroth.forumactif.com

Description du problème

Bonjour à tous,

je viens une fois encore solliciter votre aide. J'ai désactivé la toolbar mais souhaite la réintégrer. Pour le moment, rien n'est officialisé sur mon forum. Notamment parce que je rencontre un problème.

Je souhaiterais la positionner sous ma bannière, mais qu'elle remonte en haut de l'écran et s'y fixe lorsque je scroll vers le bas. Il semblerait que FA bloque cette manipulation.
Donc, j'aimerais savoir si c'est impossible dans un premier temps et si non que puis-je faire ?

En vous remerciant,
des bisous à vous

[Invité]

Hello Thomas-Hilde,

Il faut par contre l'activer mais ne pas la fixer.

Modules/Toolbar/Configuration/Options
Activer la toolbar :Oui
Fixer la toolbar : Non

sur ton fofo, ton logo est centré, on va donc ajouter à la balise a dans ton template overall_header une class.

Dans le template overall_header:
Affichage/Templates/Général/ overall_header

Recherches ceci:

Code:

<!-- BEGIN switch_logo_center -->
 <a href="{U_INDEX}"><img loading="lazy" src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1"/></a>
 <br/>

Supprimes et remplaces par:

Code:

<!-- BEGIN switch_logo_center -->
 <a class="M14_toolbar"href="{U_INDEX}"><img loading="lazy" src="{LOGO}" id="i_logo" border="0" alt="{L_INDEX}" vspace="1"/></a>
                                          
 <br/>


La class "M14_toolbar" a était ajouté.

Penses a enregistrer puis à valider en cliquant respectivement sur  puis


Ensuite, le script:


Modules/HTML&JAVASCRIPT/Gestion des codes Javascript/Créer un nouveau Javascript

Mettre un titre explicite.
Cocher sur toutes les pages.


Déposes ceci:

Code:


$(function() {$(function() {
  $('#fa_toolbar').insertAfter('.M14_toolbar');
       $(window).scroll(function() {
          var faRight= $('#fa_toolbar');

if (faRight)
{
             if ($(window).scrollTop() >= 42)
             {
                faRight.addClass('fa_fix');
              
              
            
             }
            else {
                faRight.insertAfter('.M14_toolbar').removeClass('fa_fix ');
            
              
                
             }
          } else {
             if ($(window).scrollTop() >= 1)
             {
                faRight.addClass('fa_fix ');
              
              
              
             } else {
               faRight.insertAfter('.M14_toolbar').removeClass('fa_fix ');
            
              
                
             }
          }
       });
})});



Penses à cliquer sur le bouton VALIDER




Puis un peu de style pour désactiver les menus pour rétracter la toolbar et positionner les parties à gauche.

Dans la feuille de style:
Affichage/Images et Couleurs/Couleurs/Feuille de style

Ajoutes ceci:

Code:


#fa_left,#fa_search,#fa_share{float: left;}
#fa_show,#fa_hide{display:none!important;}
#fa_toolbar:not(.fa_fix) #fa_notifications{opacity:0;width: 0px;}
#fa_toolbar.fa_fix #fa_notifications{opacity:1;}
 


Penses à cliquer sur le bouton


Il y aura surement des modification a apporter concernant les notifications.
Quand la Toolbar est fixée en haut , elle a cette class:

Code:

.fa_fix

Dans le cas inverse, cette class sera supprimée.

Donc la c.s.s sera si en position en dessous du logo:

Code:

#fa_toolbar:not(.fa_fix)
{
ta css
}


Et si positionnée en haut de page:

Code:


#fa_toolbar.fa_fix
{
ta css
}


Et voilou.


a++

[Thomas-Hilde]

Salut Milouze, merci à toi pour ta réponse qui m'a beaucoup aidé !
Autre petite question, serait-ce possible que la barre "glisse" jusqu'à sa position en haut de l'écran ? Pour le moment elle se "téléporte" et je trouve ça assez brutal.

Encore merci pour ton temps

[Invité]

Hello Thomas-Hilde,

Autre petite question, serait-ce possible que la barre "glisse" jusqu'à sa position en haut de l'écran ?
Pour le moment elle se "téléporte"

La Toolbar se positionne en haut de page de mon côté!!!
Hum, que veux-tu dire par "téléporter" ?

a++

[Thomas-Hilde]

En fait je l’ai positionné sous la bannière et lorsque je scrolle vers le bas, elle se déplace d’un coup vers le haut. C’est bien ce que je voulais, mais je voulais la faire glisser doucement jusqu’en haut, au fur et à mesure que je descends.
J’espère m’expliquer clairement, c’est difficile ^^

[Invité]

Re,

désolé mais je crois que l'on ne pourra pas faire grand chose de plus .

a++

[Thomas-Hilde]

Je te remercie ! Merci beaucoup, je laisse ouvert voir si quelqu’un n’aurait pas une solution !
Merci encore

[Chacha]

Bonjour, Attention, cela fait 6 jours que nous n'avons pas de nouvelles concernant votre demande, si vous ne voulez pas voir votre sujet déplacé à la corbeille, merci de poster dans les 24h qui suivent ce message. Si votre sujet est résolu, merci d'éditer votre premier message et de cocher l'icône « résolu »

[Thomas-Hilde]

Je ne suis pas parvenu à l'effet escompté, ceci dit ça me convient, donc on peut en rester là.
Merci à Milouze !