• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

[GELOEST] Inhalt liegt unter der Slideshow statt im Anschluss angezeigt zu werden

HaTeMLchallenge

Neues Mitglied
Hallo liebe Forum-Community!

Bin neu hier und habe natürlich ein kleines Problemchen, bei dem ich gerade nicht weiterkomme und euch gerne um Hilfe bitten möchte.

Zuerst möchte ich mich aber kurz vorstellen, wie es sich eigentlich ja auch gehört, wenn man irgendwo „neu“ ist. Von Beruf Grafik-Designer, komme ich zwar mit Webdesign in Berührung, von html habe ich aber keinen blassen Dunst, was mich schon länger sehr gestört hat. Und so nutze ich die Coronabedingte Kurzarbeit dazu, mir ein paar html-Kenntnisse anzueignen. Damit das nicht nur schnöde Theorie bleibt, wage ich mich gerade daran für meine Frau meine erste Website zu erstellen.

Auf der Suche nach einer html-Slideshow bin ich hier in einem anderen Beitrag auf eine schöne Lösung von @basti1012 gestoßen, die ich in meiner Website verwendet habe (hoffe du hast nichts dagegen @basti1012).

Und da sind wir schon bei meinem Problem: Wie kriege ich es hin, dass der Inhalt der Seite im Anschluss der Slideshow angezeigt wird, und nicht darunter liegt? Die Slideshow soll immer formatfüllend, so groß wie der Viewport sein. Das klappt ja auch, nur sieht man beim überblenden der Slideshow-Sequenzen den weiteren Seiten-Inhalt durchschimmern. Der Inhalt dürfte aber erst beim scrollen in den Viewport reinkommen. Wie geht das?

Würde mich freuen, wenn jemand eine Antwort dazu weiß, herzlichen Dank :-)
Ralf

Hier der Link zur html-Datei mit der Slideshow und dem darunter „durchschimmernden“ Inhalt:
https://filehorst.de/d/dGwqnfgn
 
Zuletzt bearbeitet:
Werbung:
Kannst du mal bei codepen ein Beispiel machen?
Hatte ja gesagt das dein Problem mit Flexbox zu beheben ist.
Deine festen Positionen machen das größte Problem.
 
Hallo @basti1012,
besten Dank für deine Antwort. Habe mich mal bei codepen angemeldet und versucht einen Pen zu erstellen.
Hier der link, hoffe das er funktioniert: slideshow

Danke auch für den Tip mit Flexbox, dachte Flexbox nimmt man in erster Linie wenn man Objekte auf einem breiten Viewport nebeneinander, und auf einem schmalen Viewport untereinander anordnen möchte – und darum geht es bei meinem Slideshow-Problem ja eigentlich nicht. Wobei Flexbox sicherlich noch für ein paar Dinge mehr geeignet ist, ich kenne es bis jetzt halt einfach nur sehr begrenzt :-). Denke auch schon darüber nach, welche Flexbox-Codes mich wohl weiterbringen könnten...
 
Werbung:
Nur Flex Box hilft nicht.
Erstmal muss die CSS gereinigt werden.
Beim kurzen Testen konnte ich ca. 200 Zeilen CSS löschen.
Dann muss man Position absolute und fixed austauschen, löschen oder ändern damit das alles so läuft wie du es haben möchtest.
Das alles erklären kann ich nicht und das du es alleine hinbekommst bezweifle ich (SORRY).
Ich komme dadrauf, weil wer Code kopiert, der kein Sinn hat, macht sich nicht viel Gedanken da drum.
Da muss ich mir aber auch den Schuh anziehen weil ich den Code 2018 wahrscheinlich genau so kopiert habe.
Das mache ich jetzt nicht mehr so weil vor 2 Jahren wahr ich auch noch in der Anfänger Zeit.
Ich ändere dein Coe jetzt mal, weil bin auch etwas schuld da dran
 
Puhhhh, das beruhigt mich gerade aber doch sehr, dass du dir die Mühe machst mal nach der Sache zu schauen, komme nämlich gerade nicht wirklich weiter damit... 200 Zeilen unnötig?...das ist mit den vielen Leerzeilen in meinem Code gerechnet, oder? (Spaß!!) Tausend Dank, Basti, bin gespannt auf deine Code-Anpassung.
Viele Grüße, Ralf
 
Ist auch noch nicht Perfekt aber schon mal etwas besser.

Zur Lösung

Sollte das überhaupt so aussehen wie ich es gerade habe ?
Wenn du die Css mal mit der deiner vergleichst dann sieht du was ich meine ( NICHT die Leerzeichen, dann wäre es noch kürzer).
 
Zuletzt bearbeitet:
Werbung:
Basti! G-E-N-I-A-L! Es sollte ziemlich genau so aussehen wie du es gerade gemacht hast. Super!!
Auch das Timing bei den Bildwechseln finde ich echt klasse. Lediglich die „Schwarzblende“ ist etwas lang, denke da die Slideshow Fullscreen ist, wäre es für den User etwas seltsam, wenn der Screen so lange dunkel ist – das ist jetzt aber beim besten Willen nicht als Kritik gemeint, bitte nicht falsch verstehen :-). Bin super-happy, deinen Code werde ich mir definitiv noch bis ins kleinste Detail in Ruhe anschauen. Vor allem will ich kapieren welche Zeile was macht...
Danke dir wirklich sehr, hast mir sehr geholfen!
Beste Grüße, Ralf
 
Zurück
Oben