Hallo LeoZauberfloh.
So ich habe den code jetzt mal ein wenig aufgeräumt und den Doctype Konsequenz auf html5 gesetzt.
Gute Entscheidung! Du hast aber so konsequent aufgeräumt, dass nun zum Beispiel gar kein öffnendes <html>
-Tag mehr vorhanden ist. Das ist einer von einer ganzen Reihe von Fehlern, die dir der im Fuß deiner Seite verlinkte Validator nennt. Unter anderem moniert der Validator nicht korrekt maskierte Leerzeichen in Dateinamen und mehrfach vergebene id
s. Das oder die falschen Attribute in den <audio>
-Elemente könnten auch der Grund sein, weshalb die nicht funktionieren.
Leider bleibt das Problem nach wie vor bestehen. Auf meinem PC klappt's wunderbar, nur auf meinem Android scheint die Slideshow nachträglich geladen zu werden und einfach über den nachfolgenden Inhalt gelegt zu werden.
Ob dein vier Jahre alter Slider mit der allerneuesten Version von jQuery funktioniert, ist fraglich. Wenn in der Dokumentation des Sliders auf die Version 1.7 verwiesen wird, würde ich die letzte Unterversion von Version 1.7 verwenden. Wenn es damit auch nicht funktioniert, hast du zumindest weitestgehend ausgeschlossen, dass jQuery und der Slider nicht richtig harmonieren.
Die Höhe des Headers soll eigentlich automatisch an die Größe der Bilder angepasst werden. Klappt das nicht, wenn auf ein Javascript Element verwiesen wird?
Doch, grundsätzlich kann das funktionieren. Aber hast du mal nach ausschließlich CSS-basierten Slidern gesucht? Eigentlich brauchst du dafür nämlich gar kein Javascript.
Ich habe das Problem vorübergehend so gelöst, dass ich eine feste Höhe in Pixeln für den Header angegeben habe. Aber so habe ich natürlich nicht jede Bildschirmgröße abgedeckt.
Sieh dir vielleicht mal an, wie man Bilder responsiv macht.
MfG, at