Problème avec les ancres

mikepro60 Messages postés 13 Date d'inscription   Statut Membre Dernière intervention   -  
mikepro60 Messages postés 13 Date d'inscription   Statut Membre Dernière intervention   -
Bonjour tout le monde, j'ai crée un site web que j'ai mis en ligne, il se range dans la catégorie des réseaux sociaux. Il contient un chat privé, un forum et une rubrique tutoriels. J'ai placé deux ancres sur toutes mes pages. La première permet au visiteur d'aller rapidement au pied de page et la seconde lui permet d'aller vite à l'entête. Le problème est que ces ancres sont toujours visibles sur la page. Je veux que lorsqu'un visiteur arrive sur mon site , que les ancres soient masquées par défaut et que lorsqu'il se met à scroller la page vers le bas ou vers le haut, que l'ancre correspondante puisse apparaitre et disparaitre à la fin. Quelqu'un peut-il m'aider ?

1 réponse

jordane45 Messages postés 38486 Date d'inscription   Statut Modérateur Dernière intervention   4 752
 
Bonjour,

L'ancre.. c'est l'endroit que tu "cibles".
Là, tu parles des "boutons" ( ou liens...) qui permettent de s'y rendre.

Quoi qu'il en soit, il suffit de les mettre en display:none au départ..... puis, via du javascript, détecter le fait que l'utilisateur scroll (et/ou sa position dans la page) pour les rendre visible.
1
mikepro60 Messages postés 13 Date d'inscription   Statut Membre Dernière intervention  
 
Je sais qu'il faut mettre les ancres en display none au départ voici les codes sources pour les ancres:

<p><a href="#pied_de_page"><p><img src="images/picture/ancre_bas.jpg" alt="flêche_bas" title="bas de page" id="ancre_entete"></a></p> ancre pour aller au pied de page

<a href="#menucontainer"><img src="images/picture/ancre_haut.jpg" alt="flêche_haut" title="haut de page" id="ancre_pied"></a> ancre pour aller au menu principal

si je veux les cacher je peut appliquer les propriétés css suivantes:

#ancre_entete
{
display: none;
}

#ancre_pied
{
display: none;
}

Le problème est que je n'arrive pas à mettre en place des codes javascript qui permettront de faire réapparaitre ces ancres au moment où le visiteur fait un scroll vers le bas ou vers le haut de la page.
0
jordane45 Messages postés 38486 Date d'inscription   Statut Modérateur Dernière intervention   4 752 > mikepro60 Messages postés 13 Date d'inscription   Statut Membre Dernière intervention  
 
Déjà.. pour poster du code sur le forum.. il faut le faire en utilisant les BALISES DE CODE.
Explications disponibles ici : https://codes-sources.commentcamarche.net/faq/11288-les-balises-de-code

Ensuite.. tu dis ne pas réussir à mettre en place le Javascript....
Et bien.. montres nous ce que tu as essayé ... sans ça.. comment espères tu qu'on puisse t'aider à corriger ?
(Ici on ne fourni pas le code tout cuit.. il faut déjà nous montrer ce qu'on essaye de coder avant qu'on ne donne une réponse... )

Voila de quoi commencer à t'aider

Pour le scroll:
https://www.w3schools.com/jsref/event_onscroll.asp
Pour le Display :
https://www.w3schools.com/jsref/prop_style_display.asp
0
mikepro60 Messages postés 13 Date d'inscription   Statut Membre Dernière intervention  
 
Pour le moment, je suis entrain de programmer la version mobile de mon site web. Pour cette version, je n'ai pas prévu de créer des ancres. Lorsque je vais revenir sur la version pc, je vais présenter un script java pour faire réapparaitre les ancres et s'il y'a des erreurs, vous me donnerez peut être des astuces pour les corriger.
0
Jako
 
Bonjour
pas de script Java :/ mais du JavaScript car Java != JavaScript
pour les erreurs utilisez la console du navigateur elles sont indiquées. les exemples fournit sur w3schools me semblent une bonne base pour faire ce que vous voulez, bonne chance
0
mikepro60 Messages postés 13 Date d'inscription   Statut Membre Dernière intervention  
 
merci, dès qu'il y'aura du nouveau, je vous tiendrais au courant.
0