nicht angemeldet
Phase Bildergalerie
Gunnar Bittersmann
Matthias ScharwiesHallo Ich bin 16 Und ich mache gerade in der Schule mit meiner Klasse jeder eine eigene Homepage und wollte dort eine Bildergalerie mit einem Pfeil jeweils links und rechts einbauen wo man zwischen den Bildern halt switchen kann.
Jediglich benutzen wir nur den Phase5 Editor und habe nichts weiter dazu gefunden.
Ich hoffe jemand kann mir weiterhelfen
Mit freundlichen Grüßen Quentin Seidel
-
Hallo,
ich würde für jedes Bild eine eigene HTML-Seite erstellen (bild1.html, bild2.html usw.) und auf jeder HTML-Seite mit dem img-Element ein Bild einbinden. Neben dem Bild (schwieriger) oder darunter (einfacher) fügst Du mit dem a-Element zwei Links ein: zur Seite mit dem vorigen Bild und zur Seite mit dem nächsten Bild. Wenn Pfeile angezeigt werden sollen, könntest Du im Linktext für rechts
⇒und für links⇐einsetzen. Oder die größer- und kleiner-Zeichen.Viel Spaß.
-
Moin,
Neben dem Bild (schwieriger) […]
bzw. mit einem Grid-Layout gar nicht so schwierig …
[…] oder darunter (einfacher) fügst Du mit dem a-Element zwei Links ein: zur Seite mit dem vorigen Bild und zur Seite mit dem nächsten Bild. Wenn Pfeile angezeigt werden sollen, könntest Du im Linktext für rechts
⇒und für links⇐einsetzen. Oder die größer- und kleiner-Zeichen.Oder z.B. verschiedene technische Zeichen wie ⏪ ⏩ ⏮ ⏭⏴ ⏵.
Viele Grüße
Robert -
@@meltemi
Wenn Pfeile angezeigt werden sollen, könntest Du im Linktext für rechts
⇒und für links⇐einsetzen.Aber nicht allein! Unbedingt an zugängliche Beschriftung (Text) denken! Der Text kann ggfs. visuell versteckt werden. Die Pfeile werden aus dem accessibility tree genommen, damit Screenreader nicht „Pfeil …“ vorlesen.
<a href="…"> <span aria-hidden="true">➡︎</span> <aria class="visually-hidden">nächstes Bild</span> </a>Oder mit
aria-label– mit den damit verbundenen Nachteilen:<a href="…" aria-label="nächstes Bild">➡︎</a>Oder die größer- und kleiner-Zeichen.
Och nö. Unicode hat da bessere parat:
Oder ein eigenes SVG.
😷 LLAP
--
„Dann ist ja auch schrecklich, dass wir in einem Land leben, in dem nicht nur Bildungswillige leben, sondern auch hinreichende Zahlen von Bekloppten. Das darf ich so locker formulieren, ich bin ja jetzt Rentner und muss nicht mehr auf jedes Wort achten.“
— Joachim Gauck über Impfgegner
-
-
@@Quentin Seidel
Hallo Ich bin 16 Und ich mache gerade in der Schule mit meiner Klasse jeder eine eigene Homepage und wollte dort eine Bildergalerie mit einem Pfeil jeweils links und rechts einbauen wo man zwischen den Bildern halt switchen kann.
A Content Slider. Mit Beschreibung des nötigen HTML, CSS und JavaScript.
😷 LLAP
--
„Dann ist ja auch schrecklich, dass wir in einem Land leben, in dem nicht nur Bildungswillige leben, sondern auch hinreichende Zahlen von Bekloppten. Das darf ich so locker formulieren, ich bin ja jetzt Rentner und muss nicht mehr auf jedes Wort achten.“
— Joachim Gauck über Impfgegner -
Hallo Quentin,
Herzlich willkommen bei SELFHTML!
Hallo Ich bin 16 Und ich mache gerade in der Schule mit meiner Klasse jeder eine eigene Homepage und wollte dort eine Bildergalerie mit einem Pfeil jeweils links und rechts einbauen wo man zwischen den Bildern halt switchen kann.
Jediglich benutzen wir nur den Phase5 Editor und habe nichts weiter dazu gefunden.
Die Diskussion, was in Schulen noch für Software rumliegt, hatten wir öfter. Privat willst du vielleicht etwas anderes, auch kostenloses nutzen. Hier gibt es eine kleine Einführung, die erklärt, was ein Code-Editor leisten können muss:
Ich hoffe jemand kann mir weiterhelfen
@meltemi hat Dir schon den Tipp mit den Unterseiten gegeben.
Bildergalerien, die man mit Pfeiltasten steuern kann erfordern neben HTML und CSS (für's Aussehen) oft auch JavaScript (für die Programmierung).
Du kannst da ja mal reinschnuppern:
Ohne JavaScript, aber eben auch ohne Steuerung gibt es z.B. diese Polaroid-Bildergalerie.
Viel Spaß mit deinem neuen Hobby!
Herzliche Grüße
Matthias Scharwies
--
Einfach mal was von der ToDo-Liste auf die Was-Solls-Liste setzen.“