Text switch alle paar Sekunden

Liebe Gruppe, ich bin aktuell am grübeln wie ich folgendes auf meine Page einfüge: Erklärung: Und zwar gehts darum, dass sich ein eingegebener Text alle 3-5 sekunden ändert und ein anderer an selber Stelle auftritt. - siehe Gif. Habe versucht den HTML Code über Google Chrome > Untersuchen rauszukopieren. (auf Page wo das funktioniert) Folgendes wurde aus der Stelle kopiert:

Der hier verwendete Code

<style> body{ height:100vh; text-align:center; } div{ margin-top:calc(50vh - 30px) } #zahl,#texte{ font-size:30px; } #texte{ font-size:30px; } </style> <body> <div id="ausgabe"></div> </body> <script> var tempo=2000;// Sekunden mal 1000 (1000 = 1 Sekunde) var texte=['Standard-Paletten', 'Millionen möglichen', 'Farbwerte benutzen', 'besteht kein Zwang', 'gestalterischen Gründe dagegensprechen', 'bieten diese Paletten', 'gewisse Orientierung', 'Auf jeden Fall haben solche Farbpaletten', 'einen technischen Vorteil', 'verschiedenen Hardware-Typen', 'und verschiedenen Betriebssystemen']; function farben_random(){ var farben=['red','green','blue','lightgreen','darkred','grey','DarkGrey','DarkGreen','Gold','LightGrey','LightGreen','LightPink','Lime','LimeGreen','Orange','OrangeRed','Pink','Red','SkyBlue','SteelBlue','Tomato','Violet','Yellow','YellowGreen']; return farben[rand_zahl(0, farben.length-1)]; } /*Ab hier nix mehrt ändern auser du wei0 was du tust */ var inhalt=document.getElementById('ausgabe'); function rand_zahl(zahlmin, zahlmax) { return Math.floor(Math.random() * zahlmax) + zahlmin; } setInterval(function(){ zahlout=rand_zahl(0 ,texte.length-1); color=farben_random(); inhalt.innerHTML="<div style='color:"+color+"'><span id='zahl'>"+zahlout+" </span><span id='texte'> "+texte[zahlout]+"</span></div>"; },tempo); </script>

Add Comment

* Required information
1000
Drag & drop images (max 3)
Powered by Commentics

Comments

No comments yet. Be the first!