Faire apparaitre une div quand je scroll vers le bas

Bonjour,

Pour un nouveau site, je recherche un script : quand je scroll, faire apparaître une div (depuis sur la gauche ou la droite), quand un mot apparait dans le texte, au fur et à mesure que je descend dans le contenu.

Par exemple, quand je scroll et que je rencontre un mot avec l'ancre #word1, que s'affiche en slidant la div #def-word1, qui contiendrait le complément d'info de ce mot, depuis la gauche ou la droite. Et que cette div s'affiche au même niveau que le mot

Je joins une image pour expliquer ce que je dit :

Et un début de code (peut-être) : je suis débutant, je ne sais même pas si ma structure html est la bonne. Et zéro idée pour le script …

p {
  font-family: 'Open Sans', serif;
  margin-left: auto;
  margin-right: auto;
  width: 50%;
}

a {
  color: red;
  text-decoration: none;
}

#def-word1,
#def-word2 {
  background: rgba(0, 0, 0, 0.15);
  font-style: italic;
  width: 25%;
  margin-bottom: 2px;
  display: block;
  text-decoration: none;
}

#def-word2 {
  float: left
}

#def-word1 {
  float: right
}

<p>bla bla bla bla <a href="#word1">word 1</a> bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla</p>

<p>bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla <a href="#word2">word 2</a> bla bla bla bla</p>

<div id="def-word1">here is the definition of the word 1</div>

<div id="def-word2">here is the definition of the word 2</div>

Merci beaucoup de votre aide !

PS : je viens de trouver un site qui fait ca, pour exemple : https://lesjours.fr/obsessions/start-up/ep1-incubateurs/