Notice: Undefined variable: root in /users/basti1012/www/index1.php on line 41
Horizontal Scroll Menu 2

Horizontal Scroll Menu 2

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: https://www.welt.de/mediathek/. (Wichtiges zur Beispielseite: Ich weiß nicht ob es auch bei der Desktop-Version geht, aber auf der Mobilen auf jeden Fall.) Liebe Grüße

Der hier verwendete 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>