Sticky boutton

WordPress :5.7
Statut : résolu

Ce sujet contient 20 réponses, 2 participants et a été mis à jour pour la dernière fois par RodPlay, le il y a 3 années.

15 sujets de 1 à 15 (sur un total de 21)

1 2 →

Auteur

Messages
18 août 2021 à 14 h 24 min #2383498
RodPlay
Participant

Initié WordPress
34 contributions
Bonjour,

Ma configuration WP actuelle
- Version de PHP/MySQL :
- Thème utilisé : Astra
- Extensions en place : Elementor
- Nom de l’hébergeur : Ionos
- Adresse du site :
Problème(s) rencontré(s) :

Bonjour, je crée un lien bouton sticky « glue » (fonctionne sous « fixed ») mais qui doit s’éffacer en arrivant sur le footer. Comme l’exemple joint : https://www.cabinet-narcy-orthodontie.fr (le point bleu à droite, lien vers le formulaire de contact).

Quelqu’un à un indice ou une solution ? Merci de vos retours.
19 août 2021 à 13 h 11 min #2383552

ferman
Participant

Maître WordPress
7079 contributions

Bonjour,

Quelqu’un à un indice…

Cela doit pouvoir se faire avec un peu de javascript.

…ou une solution?

Impossible à dire sans voir le site et le bouton en place.

19 août 2021 à 16 h 07 min #2383561

RodPlay
Participant

Initié WordPress
34 contributions

Bonjour ferman,

Dans l’exemple ci-dessus (cabinet Narcy), le bouton existe (je n’y ai décelé que du « elementor »).
Cependant, voici le site en cours : https://orthodontie-des3vallees.fr

Merci de beaucoup de vos lumières.

19 août 2021 à 21 h 33 min #2383590
ferman
Participant

Maître WordPress
7079 contributions
La fonction javascript ci-dessous devrait vous rapprocher de ce que vous souhaitez:
```
<script>

$=jQuery;

	$(window).scroll(function(){
		var numPix = 400; // number of pixels before bottom of page that you want to start fading
		var op = (($(document).height() - $(window).height()) -200 - $(window).scrollTop()) / numPix;
    if( op <= 0 ){
        $("a.elementor-icon").hide();
    } else {
        $("a.elementor-icon").show();
    }
    $("a.elementor-icon").css("opacity", op ); 
});
</script>
```
1. Téléchargez et activez l’extension « insert header and footers »

2. Dans le tableau de bord wordpress -> réglages, vous copierez /collerez l’intégralité du code, y compris <script> et </script>. comme indiqué sur la pièce jointe. N’oubliez pas de faire « ENREGISTRE »

Normalement ça devrait suffire.

La fonction est adaptée de celle que vous trouverez ICI
- Cette réponse a été modifiée le il y a 3 années par ferman.
- Cette réponse a été modifiée le il y a 3 années par ferman.
Fichiers joints :
Vous devez être connecté pour voir les fichiers joints.
20 août 2021 à 14 h 33 min #2383628
RodPlay
Participant

Initié WordPress
34 contributions
Excellent !

Tout fonctionne parfaitement.
Un grand merci pour votre aide précieuse.

Rodolphe
—
- Cette réponse a été modifiée le il y a 3 années par RodPlay.
20 août 2021 à 15 h 51 min #2383632

ferman
Participant

Maître WordPress
7079 contributions

Vous êtes sûr? Quand je vais sur votre site je ne vois pas l’icone elementor disparaître.

20 août 2021 à 16 h 38 min #2383635

ferman
Participant

Maître WordPress
7079 contributions

Bon ça remarche mais je crois que vous avez modifié le footer non? Il faudrait faire d’abord toutes les modifications sur le contenu de la page avant d’ajouter du js (les valeurs dans le code varient suivant la hauteur du contenu).

20 août 2021 à 17 h 22 min #2383640

RodPlay
Participant

Initié WordPress
34 contributions

Oui, je n’ai modifié que ce que j’ai interprété de votre solution.
Soit le footer, rien d’autre depuis la mise en place du bouton statique.

20 août 2021 à 17 h 58 min #2383641

ferman
Participant

Maître WordPress
7079 contributions

Vous avez bien mis le code dans le plugin comme indiqué dans la pièce jointe? pas directement dans le footer?

20 août 2021 à 18 h 20 min #2383642

RodPlay
Participant

Initié WordPress
34 contributions

Exactement, j’ai suivi vos recommandations sans déroutement, sauf erreur…

20 août 2021 à 19 h 46 min #2383646
ferman
Participant

Maître WordPress
7079 contributions
Je ne comprends pas, je vois une erreur jQuery que je n’observe pas sur mon site d’essais ni sur votre site quand j’utilise l’inspecteur firefox. Dans tous les cas le code fonctionne. Pour vous, vous aviez dit qu’il fonctionnait au début; je suppose que ce n’est plus le cas. Pouvez-vous me mettre en copie d’écran l’extension avec le code? (comme j’avais fait dans ma copie d’écran). Si on n’arrive pas à voir ce qui cloche on essaiera un autre moyen pour introduire la fonction (moyen qui fonctionne chez moi, bien sûr). Et regardez s’il n’y a rien en dehors des balises <script> et </script>. Autre chose: savez-vous vous servir du FTP pour accéder aux dossiers de votre site?
- Cette réponse a été modifiée le il y a 3 années par ferman.
21 août 2021 à 11 h 53 min #2383653

RodPlay
Participant

Initié WordPress
34 contributions

L’action fonctionne sous une version récente d’OSX mac, avec Safari.

Pas sous Chrome ni Firefox.
Et rien du tout sous OS plus ancien…

J’ai peut-être commis une erreur ?

Fichiers joints :
Vous devez être connecté pour voir les fichiers joints.

21 août 2021 à 12 h 21 min #2383658
ferman
Participant

Maître WordPress
7079 contributions
J’ai peut-être commis une erreur. Non je ne pense pas. Avant d’aller plus loin essayez d’abord la chose suivante.
1. vous supprimez la première ligne du code ($=jQuery;)
2. Vous remplacez tous les $ par jQuery (par ex : $(window) -> jQuery(window)…etc
21 août 2021 à 12 h 51 min #2383660

RodPlay
Participant

Initié WordPress
34 contributions

Modifications réalisées sans conséquences.

Fichiers joints :
Vous devez être connecté pour voir les fichiers joints.

21 août 2021 à 13 h 00 min #2383662

RodPlay
Participant

Initié WordPress
34 contributions

Oui pour le ftp, pardon.
Auteur

Messages