Bildunterschrift im iframe anzeigen

[Hans]

Ich habe eine Seite gebaut, auf der man mittels Stichwort eine von vielen Grafiken finden kann. Funktioniert auch soweit, das Stichwort angeklickt zeigt das Bild auf der rechten Seite. Jetzt hätt ich gern zusätzlich den Titel des Bildes darunter angezeigt, hab aber keinen blassen Schimmer wie das gehen soll. Hat einer einen Tipp wie ich die Befehlszeile verändern muss? Danke vielmal!

So solls mal aussehen

<a onmouseover="this.click();" href="../klein/KIN_481.jpg" target="iframe01">Computerspiel - KIN_481</a>&emsp;<a href="../gross/KIN_481.jpg" target="_blank">&darr;</a><br>

[Rolf B]

Hallo Hans,

da wirst Du etwas mehr JavaScript als ein onmouseover="this.click()" bemühen müssen. Wieviel JavaScript kannst Du?

Rolf

[Gunnar Bittersmann]

@@Rolf B

da wirst Du etwas mehr JavaScript als ein onmouseover="this.click()" bemühen müssen.

Darf’s auch etwas weniger sein? Ich kann mir keinen Anwendungsfall vorstellen, wo schon beim Überfahren mit der Maus der Click auf den Link ausgelöst werden soll.

🖖 Живіть довго і процвітайте

[Rolf B]

Hallo Gunnar,

das ist eine andere Frage. Die hab ich mir auch gestellt, und mir gedacht: das ist ein Nebenschauplatz. Es ist ja auch ganz nett, wenn man nur die Maus schubsen muss und das Bild wechselt, ohne dass man klickt. Die Zugänglichkeit beeinträchtigt das mNn auch nicht.

Hauptsächlich ging es mir um den Aspekt, dem iframe einen bildspezifischen Untertitel zuzuordnen. Da sehe ich JavaScript am Start. Oder (Bier wegstell)...

<ul id="bilderliste">
<li>
  <a onmouseover="this.click(); this.focus();" 
     href="bild17_4.xyz" target="bildframe">Bild 17+4</a>
  <p class="description">Dies ist die elegante 17 über einer grünen 4</p>
</li>
<ul>

#bilderliste .description {
   position: absolute;
   left: ...; top: ...;   /* unterm iframe halt */
   display: none;
}
#bilderliste a:focus .description {
   display: block;
}

Braucht vermutlich noch ein paar Tweaks und eine Prise aria, damit ein Screenreader merkt, dass die Fokussierung die sichtbare Description geändert hat, aber könnte glatt funktionieren… Wenn man will auch ohne onmouseover, dafür mit manüllem Klick. Oder einfach nur durchtabben.

Rolf

[Hans]

@ Rolf B Ich hab jetzt mal den Teil

#bilderliste .description { position: absolute; left: ...; top: ...; /* unterm iframe halt */ display: none; } #bilderliste a:focus .description { display: block; }

in die .css Datei

und

<ul id="bilderliste"> <li> <a onmouseover="this.click(); this.focus();" href="bild17_4.xyz" target="bildframe">Bild 17+4</a> <p class="description">Dies ist die elegante 17 über einer grünen 4</p> </li> <ul>

in die .htm Datei (die Dateien angepasst). Tja, außer dass ein Aufzählungspunkt erscheint, tut sich nichts.

html kann ich ein bisschen basteln, javascript kann ich leider überhaupt nicht.

Ich dachte, es gäbe vielleicht einen einfachen Weg.

Trotzdem vielen Dank,

Hans