Bonjour, j'aimerais pouvoir ajouter une petite fonction à mon footer. J'aimerai qu'il y est une petit croix pour que les utilisateurs puissent le fermer ou l'ouvrir. Il y a une quantité de sujet là dessus mais ca concerne surtout afficher/masquer du texte et c'est pas vraiment ce que souhaite.

Connaissez vous des tutoriels ou script spécifique à ca?

Merci Smiley cligne
Hello,

Avec javascript/jQuery, c'est très simple à mettre en place. Exemple à comprendre puis à adapter à ton cas par toi même :

HTML :

<a class="btn-toggle" href="#">Ouvrir/fermer le pied de page</a>
<div class="footer">
    <p>Du texte dans mon pied de page</p>
</div>

JS (note : pense à inclure la lib jQuery avant ton code) :

$(function(){
    $('.footer').hide(); /* Masquer le pied de page au chargement de la page */
    $('.btn-toggle').click(function(event){
        event.preventDefault(); /* au clic sur le bouton, ne pas suivre le lien */
        $('.footer').slideToggle(); /* deplier ou replier l'élément */
    });
});

Les fonctions jQuery utilisées dans cet exemple sont hide(), click(), slideToggle() (suivre les liens pour accéder à la doc).
À toi d'adapter cette base à ton cas par toi-même ! Reviens poster ici si tu rencontre des soucis Smiley smile
Modifié par audrasjb (20 Sep 2014 - 14:08)
Merci audrasjb, mon plus gros souci va être de comprendre comment bien intégrer :
$(function(){
    $('.footer').hide(); /* Masquer le pied de page au chargement de la page */
    $('.btn-toggle').click(function(event){
        event.preventDefault(); /* au clic sur le bouton, ne pas suivre le lien */
        $('.footer').slideToggle(); /* deplier ou replier l'élément */
    });
});


car je débute. ceci est donc un js que je peut intégrer dans un fichier.js que peux ensuite appeler dans mon body comme ceci :
<script src="js/fichier.js"></script>


mais qu'est ce que la "lib jQuery" ? J'ai un fichier intitulé jquery-1.11.0, dans mon thème, est ce que je dois l'utiliser ?
Bonjour,

Lorsque le footer doit être masqué au chargement de la page, l'utilisation d'un display:none en css n'est-il pas meilleur qu'un hide() javascript ?
Salut,
gwenm a écrit :
Merci audrasjb, mon plus gros souci va être de comprendre comment bien intégrer (…) car je débute. Qu'est ce que la &quot;lib jQuery&quot; ? J'ai un fichier intitulé jquery-1.11.0, dans mon thème, est ce que je dois l'utiliser ?

Oui, il faut l'intégrer juste avant le script JS cité ci-dessus, de préférence juste avant la fermeture de balise </body> (donc dans ton fichier footer.php a priori).
AliceRossa a écrit :
Lorsque le footer doit être masqué au chargement de la page, l'utilisation d'un display:none en css n'est-il pas meilleur qu'un hide() javascript ?

Si on veut, le code ci-dessus n'est qu'un exemple basique. On peut aussi animer l'affichage du bloc avec la fonction animate(), mettre un timer, etc. L'idée c'était surtout de montrer à gwenm dans quelle direction se diriger Smiley cligne
Pour préciser ma dernière réponse, tu vas obtenir quelque chose comme ça dans ton fichier footer.php :

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
$(function(){
    $('.footer').hide(); /* Masquer le pied de page au chargement de la page */
    $('.btn-toggle').click(function(event){
        event.preventDefault(); /* au clic sur le bouton, ne pas suivre le lien */
        $('.footer').slideToggle(); /* deplier ou replier l'élément */
    });
});
</script>

Smiley smile
Modifié par audrasjb (21 Sep 2014 - 19:38)