Ajouter des boutons "Haut / Bas"

Voir le sujet précédent Voir le sujet suivant Aller en bas

  • 0

Astuce Ajouter des boutons "Haut / Bas"

Message par Threax le Mer 22 Fév 2012 - 13:05

Ajouter des boutons "Haut / Bas"


Ce tutoriel vous permettra de placer deux boutons de retour en haut ou en bas de page sur l'ensemble des pages de votre forum :



Création du script

Panneau d'administration  Modules  HTML & JAVASCRIPT - Gestion des codes Javascript

Assurez-vous que la gestion des codes Javascript est activée, puis créez un nouveau javascript ayant pour titre "Bouton haut/bas" et pour placement "Toutes les pages".

Insérez-y le code suivant :
Code:
$(function(){
          $("body").append('<div class="boutonhautbas"><a href="#top"><img src="https://i.imgur.com/hkOmuCD.png" alt="Aller en haut" /></a> <a href="#bottom"><img src="https://i.imgur.com/G3Io37u.png" alt="Aller en bas" /></a></div>');
});

Remplacez si vous le souhaitez l'URL des images par vos propres images :
- https://i.imgur.com/hkOmuCD.png
- https://i.imgur.com/G3Io37u.png


Ajout du CSS (placement des boutons)

Panneau d'administration  Affichage  Couleurs - Feuille de style CSS

Insérez ce code dans votre feuille de style personnalisé :
Code:
.boutonhautbas {
    bottom: 40px;
    right: 10px; /* remplacez right par left pour afficher les boutons à gauche */
    position: fixed;
    z-index: 100;
}

avatar

Threax
Membre actif

Masculin
Messages : 17276
Inscrit(e) le : 27/08/2005

http://lesforumsde.forumactif.com
Threax a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum