Imagesslider mit einem Sprunganker verlinken/Webseite hochgeladen

[Matthias Scharwies]

Servus Frog!

Ich hab mit einem Slider, welcher in JS programmiert ist, ein Problem. Den fertigen Teil meiner Webseite hab ich nun zwecks Übersicht hier:

http://newwebsite.bplaced.net/

Super, so können wir alles anschauen und das JS inpizieren

Solte bei einem Frog die Webseite nicht grün sein? duckundwech 😀

Zuerst zum HTML:

Dein HTML ist valide, das ist schon mal gut!

Du verwendest aber viele div-Elemente, was man anders machen könnte. (Siehe: HTML/Tutorials/HTML5/Seitenstrukturierung)

Deine <div class="btn"></div>wollen bestimmt button-Elemente sein. Dann musst du kein click-Event zuweisen, dass ist dann schon da! Deine buttons haben keine Beschriftung (label). Man weiß gar nicht, dass man da drauf klicken kann. Leute, die sich die Webseite im Auto vorlesen lassen, können gar nichts erkennen.

Zum CSS:

Man sollte nur in Ausnahmefällen etwas absolut positionieren. Dann braucht man aber auch kein Flexbox mehr:

.contentThumb {
    position: absolute;
    overflow-x: hidden;
    width: 635px;
    height: 75px;
    margin-top: 190px;
    cursor: none;

Feste Werte heißen magic numbers und sind verpönt, da du gar nicht weiß, mit welchen Gerät ich grad im Internet bin.

zum JS

Meine Webseite hat zwei Imageslider, welche miteinander Verbunden sind. Der erste befindet sich auf der Startseite „index.html“ in Form von Thumbnails. Die einzelnen Thumbnails führen auf „mixedmedia.html“, auf der man dann die entsprechende Vollbildansicht sehen soll! Also mit dem klick auf das z.B. 3. Thumbnail gelangt man auf die Seite „mixed media“ zur 3. Vollbildversion! Mit dem Sprunganker mixedmedia.html#three, usw. klappt das auch!

Allerdings befindet sich auf der Seite „mixedmedia.html“ auch ein Hamburger-Menü, über welches man dann auch auf Kontaktdaten, kurzen Lebenslauf und den anderen Menüs wie „vector.html“ und „handdraw.html“ gelangen kann. Und dieser Hamburger ist ab dem zweiten Thumbnail nicht mehr da. Ausserdem passen sich die Illus nicht mehr dem Browserfenster an, da wird dann der gesamte Slider mitskaliert.Und auch die Slider-Pfeile passen nicht mehr, vielleicht hat da auch jemand einen kleinen Tipp für mich! Also NUR wenn ich auf das erste Thumbnail, den Astronauten click, verhält sich die Vollbilldillu so wie es sein soll! Vielleicht ist die Lösung ja auch eine ganz einfache, aber ich seh sie einfach nicht!!

nicht böse sein: Ich steig durch dein Konzept nicht durch.

Ich würde auf der ersten Seite das Hamburger-Menü realisieren. Ich will schon auf der Startseite deinen Lebenslauf anklicken können.

Die Vorschaupunkte würde ich als "thumbnails"- realisieren. Dazu gehören aber die einzelnen Textbeschreibungen.

Entscheide dich jetzt:

1. Thumbnailbuttons öffnen auf der gleichen Seite einen Image-Slider

oder

2. thumbnail-Links öffnen Unterseiten.

Ich hab jetzt zum erstem mal in JS programmiert! Mein Code hat bisher noch niemand gesehen! Vieles kann man sicher kürzer und knackiger programmieren. Bin also für jedes Feedback Dankbar und weiss es wirklich zu schätzen!!

Ich würde Deinen Lebenslauf ins HTML packen. Da gehört er hin und wird auch von Suchmaschinen gefunden.

Ich muss jetzt leider weg, schau mir das später (oder morgen) noch mal an.

Herzliche Grüße

Matthias Scharwies