Hello,

J'essaie de créer un petit menu dynamique pour scroller vers différentes sections. Je pense avoir fait le plus gros mais je bloque sur la fin

Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<ul id="slide-menu"></ul>
 
<div id="slide1" class="slide">
    <h2>Slide 1</h2>
</div>
 
<div id="slide2" class="slide">
    <h2>Slide 2</h2>
</div>
 
<div id="slide3" class="slide">
    <h2>Slide 3</h2>
</div>
 
<div id="slide4" class="slide">
    <h2>Slide 4</h2>
</div>

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
 
let sections = document.querySelectorAll('.slide')
let nbrMenuLinks = sections.length;
 
for(i = 0; i < nbrMenuLinks; i++) {
    const li  = document.createElement('li');
    li.className = 'scroll-item';
    li.id = 'btn'+(i+1);
    li.appendChild(document.createTextNode((i+1)));
    document.querySelector('#slide-menu').appendChild(li);
    li.addEventListener('click', ()=>{
        window.scroll(0,findPos('li#'+(i+1)));
    });
}
 
 
const findPos =  (obj) => {
    let curtop = 0;
    if (obj.offsetParent) {
        do {
            curtop += obj.offsetTop;
        } while (obj = obj.offsetParent);
    return [curtop];
    }
}
Je n'arrive pas à scroller vers le #slide qui a le même id que mon li, il me manque la bonne syntaxe...

Merci pour votre aide et et éventuels conseils si ce n'est pas très propre