basti1012.bplaced.net

Hallo, ein gesundes neues Jahr wünsche ich euch! Hat jemand eine Ahnung wie man das Menu erstellt wo man zur Seite scrollen kann? Beispielsweise auf dieser Seite: <a href="https://www.welt.de/mediathek/.">https://www.welt.de/mediathek/.</a> (Wichtiges zur Beispielseite: Ich weiß nicht ob es auch bei der Desktop-Version geht, aber auf der Mobilen auf jeden Fall.) Liebe Grüße

Code

                                    
                                <style>
.displayleft{
  position:absolute;
  top:50%;
  left:0px;
}
.displayright{
  position:absolute;
  top:50%;
  right:0px;
}
</style>
<div id="bildconti"  >


<img class="mySlides"  src="/image/fjords.jpg">
<img class="mySlides"   src="/image/lights.jpg">
<img class="mySlides" src="/image/coffee.jpg">
<img class="mySlides"   src="/image/sound.jpg">
 <button class="w3-button displayleft" onclick="plusDivs(-1)">❮</button>
<button class="w3-button displayright" onclick="plusDivs(+1)">❯</button>
<button class="automatischan" onclick="carousel()">Automatisch an</button>
<button class="automatischaus" onclick="carousel1()">Automatisch aus</button>
 
</div>
<script>
var slideIndex = 1;
showDivs(slideIndex);

function plusDivs(n) {
    showDivs(slideIndex += n);
}

function showDivs(n) {
    var i;
    var x = document.getElementsByClassName("mySlides");
    if (n > x.length) {slideIndex = 1} 
    if (n < 1) {slideIndex = x.length} ;
    for (i = 0; i < x.length; i++) {
        x[i].style.display = "none"; 
    }
    x[slideIndex-1].style.display = "block"; 
}


var slideIndex = 0;
function carousel1(){
 clearTimeout(loschen);
}
function carousel() {
    var i;
    var x = document.getElementsByClassName("mySlides");
    for (i = 0; i < x.length; i++) {
      x[i].style.display = "none"; 
    }
    slideIndex++;
    if (slideIndex > x.length) {slideIndex = 1} 
    x[slideIndex-1].style.display = "block"; 
    loschen=setTimeout(carousel, 2000); // Change image every 2 seconds
}
</script>