Flèche haut de page 
Autor: Maximilien V.
Visitado 1978,
Seguidores 1,
Compartilhado 0
Bonjour à toutes et tous,
En cours de création d'un nouveau site, j'aimerais savoir comment faire pour intégrer une fleche de retour vers le haut de la page.
Je vous ai joint une image à toutes fins utiles. Le site qui m'inspire est connu, c'est celui de website ... :-)
Merci d'avance pour vos réponses.
Cordialement
Maximilien
Publicado em
Re-Hello Maximillien,
La solution la plus simple consiste à mettre une petite image "flèche vers le haut" et d'y insérer tout simplement le lien de la page en question. En cliquant sur l'image on remonte tout en haut de la page du site. Voir ma copie écran jointe pour exemple.
Un anglais a trouvé un truc intéressant et l'a proposé en idée. Voir ici :
https://helpcenter.websitex5.com/post/114132 et aller sur la page dont est indiqué le lien. On voit les flèches en bas de la page, et elles permettent de monter et descendre... Mais je n'ai pas d'infos complémentaires pour créer la chose.
@+ et bonne continuation, J.P.
Salut Jipé & Maximillien,
@Jipé : Le lien que tu donne pointe vers ce même post
(Edit J.P. : Oupssss... J'ai rectifié le tir. Merci... ;o)
Voici un post (peut-être le même, en anglais), qui permet d'inclure un bouton "scrollback"
en intégrant un script JSquery.
https://helpcenter.websitex5.com/post/107161
La manip' fonctionne à merveille (je l'utilise sur mon propre site).
Cordialement,
Arnaud
Autor
Re,
Alors ... après un peu de recherches (je n'aime pas rester en plan) ... mais n'étant pas un pur informaticien :
1/ J'insère un code html :
<div id="hdp"> <a href="#"> <img src="http://"adresse de l'image" width="50 height="50 alt="Haut de page." title="Haut de page"> </a> </div>
2/ Je rajoute en code css :
div#hdp img { border:0; position:fixed; top:500px; right:25px; }
Ces codes sont à mettre sur chaque page du site. C'est peut-être le seul truc c****
En test, sous fire fox et chrome, ça m'a l'air pas mal du tout. Apparemment sous IE aussi.
Si quelqu'un a envie de tester à son tour ...
Cordialement
Maximilien
Bonsoir Maximillien, et bonsoir J.P. et Arnaud,
Personnellement, j'ai placé le code suivant au niveau de l'option 4 Statistiques, SEO et code, avant la balise de fermeture </HEAD> :
<script>
_jq(function() {
var elem = '<img onclick="return x5engine.utils.location(\\'\\')" id="IcmScrollToTop" alt="" style="cursor:pointer;position:fixed;bottom:15px;right:15px;display:none;z-index:102" src="data:image/png;base64,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" />';
_jq("body").append(elem);
_jq(window).scroll(function () {
if (_jq(window).scrollTop() > 100) {
_jq('#IcmScrollToTop').fadeIn();
} else if (_jq(window).scrollTop() < 50) {
_jq('#IcmScrollToTop').fadeOut();
}
});
});
</script>
Le résultat donne le même résulat que sur le site http://www.websitex5.com/fr/ sur l'ensemble des pages du site.
Je pense que cela correspond tout à fait à ton besoin, Maximillien
@+, Laurent.
Oups,
J'espère n'avoir pas fais de bêtise en publiant çà. Si tel est le cas, merci aux modérateurs de supprimer mon post et d'accepter toutes mes excuses.
Laurent.
Autor
Ah oui, effectivement c'est bien mieux.
Merci.
ps : dommage que cette fonction ne soit pas proposée en "automatique", ça donne quand même un bon look aux sites.
Maximilien