Bild nur bei Klick vergrößern

Question

Lieber SoSciSurvey-Support,

ich bereite gerade eine Studie vor, bei der die Teilnehmer zu Beginn eine Weltkarte sehen. Diese soll bei Klick (und nur bei Klick) mit einer Maus auf doppelte Größe vergrößert werden. Ich habe mich schon am CSS-Code versucht. Mit pageCSS(); wollte ich auf der betreffenden Seite einfach Code einfügen, der nur auf focus, nicht aber auf hover reagiert. Folgender Code hat aber nicht zum Erfolg geführt:

pageCSS('
a.s2zoom img,
img.s2zoom {
transition: transform .2s;
}
a.s2zoom:focus img
');

Was mache ich falsch?

Vielen Dank schon einmal für die Hilfe!

Comments

Ohne Kontext schwer zu sagen. Möchten Sie wohl bitte mal einen Pretest-Link direkt zu der betroffenen Seite erstellen und als Kommentar posten?

---

Klar doch, hier ein Link: https://www.soscisurvey.de/anc-exp4/?act=PfwbQWTtmM0IIOcbMXte70Jt

Answer 1

Soweit ich sehe, ist das Problem folgendes: Der Browser gibt dem <a> keinen Fokus, wenn man es anklickt.

Bitte ändern Sie einmal

<a class="s2zoom2x">

in

<a class="s2zoom2x" href="#">

Und die Zeilen mit :hover nehmen sie wieder aus dem CSS-Code.

Comments

Vielen Dank! Ich habe da Item angepasst und den Code von der aktualisierten Hilfe-Seite genommen (danke dafür)!
Leider habe ich immer noch Zoom, auch wenn die Maus nur über dem Bild ist (ohne Klick).
Falls Sie noch einmal schauen wollen, der Testlink funktioniert noch und hat alle Änderungen.

---

Sie müssten bitte die Klasse noch anpassen von "s2zoom2x" auf "s2zoom" (der Name ist im Prinzip frei wählbar, er musst nur zum CSS-Code passen), damit nicht die vordefinierten Einstellungen greifen, sondern Ihre angepassten.

---

Läuft, vielen Dank!