Hallo!
Ich hab vor mir ein Online-Portfolio zu erstellen. auf dem Grafiken angezeigt werden (z.B. jeweils 3 in einer Reihe, insgesamt 3 Reihen). Nun möchte ich, dass man mit der Tastatur durch die Grafiken navigieren kann (Pfeiltasten) und diese auswählen kann (Enter), um auf eine neue Seite zu gelangen, von dieser aus, soll man via Tastatur wieder zurück zur vorigen kommen (z.B. mit Enter).
Sowas müsste doch eigentlich mit JavaScript gehen, oder? Ich hab leider keine Ahung wie ich da ansetzten muss.
Ich wäre sehr dankbar über Hilfe! 
Grüße
(X)HTML hat für eine ähnliche Funktionalität accesskey:
edition-w3.de/TR/1999/REC-ht … ccess-keys
Zusammen mit Fragmentidentifizierern (id-Attribut) sollte etwas
ähnliches wie ein Navigationsring zu machen sein.
tabindex ist auch eine interessante Möglichkeit:
edition-w3.de/TR/1999/REC-ht … f-tabindex
Auch damit läßt sich eine Navigationsring erstellen.
Ganz so komfortabel wie etwa in SVG tiny 1.2 ist das in (X)HTML
allerdings noch nicht und benötigt etwas mehr Schreibarbeit.
Ein Skript braucht man dafür jedenfalls nicht.
Wenn jetzt nicht alle Graphiken aufeinmal sichtbar sein sollen,
erreicht man das durch geeignetes CSS, z.B. durch Positionierung
oder auch mit :hover/:focus/:activate
Nachteil bei einem Dokument ist aber so oder so, daß alles
geladen wird.
Besser ist bei Graphiken meist, wenn man Vorschaubilder hat,
unten denen man auswählen kann und dann durch aktivieren
eine neue Seite mit dem vollen Bild und den anderen
Vorschaubildern aufrufen kann.
Hallo und danke für deine Antowort!
Ich verstehe glaube ich noch nicht ganz, wie das funktionieren soll. Accesskey weißt einem Element eine Taste zu. Wenn diese gedrückt wird, erhält das Element den Fokus. Und dann?
Ich möchte ja zum Beispiel sowas hier machen, nur so, dass man via Pfeiltasten durch die Bilder navigieren kann.
Man kann doch sowas schreiben:
<a id="Ziel1" href="#Ziel2" accesskey="a" tabindex="1"><img src="beispiel1.png" alt="Beispiel 1" /></a>
<a id="Ziel2" href="#Ziel1" accesskey="b" tabindex="2"><img src="beispiel2.png" alt="Beispiel 2" /></a>
Zumindest Tabulator und Mauszeigerklick sollten dazu führen, daß
zwischen den beiden Zielen hin- und hergesprungen wird,
zumindest wenn die nicht in denselben Anzeigebereich passen und
sonst nicht da ist, was per Tabulator den Fokus bekommen könnte.
Pfeiltasten müßtest du nachgucken, ob und wie man die notieren
kann (bin mir ziemlich sicher, daß die Notation, die ich von
SVG tiny 1.2 kenne und die von einem entsprechenden
DOM-Arbeitsentwurf stammt, bei (X)HTML noch nicht
funktionieren wird). Man kann sinnvoller Weise natürlich nicht
die gleiche Taste für mehrere Elemente verwenden. Auch müßte
man irgendwo angeben, welche Taste wozu gut ist.
An sich hat das jeweilige Element dann zumindest den :focus,
der auch verwendet werden könnte, um die CSS-Dekoration zu
ändern, mag aber sein, daß es browser gibt, die :focus und
:activate nicht interpretieren - oder zumindest nicht bei
beliebigen Elementen, wie es vorgesehen ist (Ich meine, bei
Opera gibt es da z.B. Probleme), liegt aber teilweise auch daran,
daß in CSS solche ‘Ereignisse’ wie das Eintreffen
von :hover, :focus und :activate nicht präzise definiert sind.
geekpedia.com/tutorial138_Ge … cript.html
hoffmann: Javascript ist doch die gängigste Methode
logicalmind: sorge trotzdem dafür, dass die Seite ohne Javascript bedienbar ist (durch Standardlinks)
Oh, danke an euch!
Mir scheint da JavaScript dann doch auch sinnvoller! Super! 
Vielen, vielen danke!
