@@Gunnar Bittersmann > ~~~HTML > <td> > <button onclick="choose(…)"> > <img src="Lol.png" alt="Rückseite"> > </button> > </td> > ~~~ An der Stelle habe ich schon mal die `width`- und `height`-Attribute weggelassen. Wenn die für alle Bilder gleich sind, kann man das auch mit einer Angabe im CSS für alle Bilder auf einmal haben – wenn man die Bilder denn überhaupt skalieren möchte. `width`- und `height`-Attribute können helfen, das Seitenlayout gleich initial so zu rendern, dass der Platz für die (noch nicht geladenen) Bilder freigehalten wird. Das ist hier nicht erforderlich, denke ich. Im nächsten Schritt wäre auch noch das `onclick`-Attribut wegzulassen und der Eventhandler im JavaScript zu registrieren (`addEventListener`{:.language-js}, siehe [molily](https://molily.de/js/event-handling-fortgeschritten.html)). Am besten nicht für jeden Button einzeln, sondern per [event delegation](https://molily.de/js/event-handling-effizient.html#delegation){:@en hreflang="de"}. LLAP 🖖 -- *„Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“* —Kurt Weidemann

@@Gunnar Bittersmann > ~~~HTML > <td> > <button onclick="choose(…)"> > <img src="Lol.png" alt="Rückseite"> > </button> > </td> > ~~~ An der Stelle habe ich schon mal die `width`- und `height`-Attribute weggelassen. Wenn die für alle Bilder gleich sind, kann man das auch mit einer Angabe im CSS für alle Bilder auf einmal haben – wenn man die Bilder denn überhaupt skalieren möchte. `width`- und `height`-Attribute können helfen, das Seitenlayout gleich initial so zu rendern, dass der Platz für die (noch nicht geladenen) Bilder freigehalten wird. Das ist hier nicht erforderlich, denke ich. Im nächsten Schritt wäre auch noch das `onclick`-Attribut wegzulassen und den Eventhandler im JavaScript zu registrieren (`addEventListener`{:.language-js}, siehe [molily](https://molily.de/js/event-handling-fortgeschritten.html)). Am besten nicht für jeden Button einzeln, sondern per [event delegation](https://molily.de/js/event-handling-effizient.html#delegation){:@en hreflang="de"}. LLAP 🖖 -- *„Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“* —Kurt Weidemann

@@Gunnar Bittersmann > ~~~HTML > <td> > <button onclick="choose(…)"> > <img src="Lol.png" alt="Rückseite"> > </button> > </td> > ~~~ An der Stelle habe ich schon mal die `width`- und `height`-Attribute weggelassen. Wenn die für alle Bilder gleich sind, kann man das auch mit einer Angabe im CSS für alle Bilder auf einmal haben – wenn man die Bilder denn überhaupt skalieren möchte. `width`- und `height`-Attribute können helfen, das Seitenlayout gleich initial so zu rendern, dass der Platz für die (noch nicht geladenen) Bilder freizuhalten. Das ist hier nicht erforderlich, denke ich. Im nächsten Schritt wäre auch noch das `onclick`-Attribut wegzulassen und den Eventhandler im JavaScript zu registrieren (`addEventListener`{:.language-js}, siehe [molily](https://molily.de/js/event-handling-fortgeschritten.html)). Am besten nicht für jeden Button einzeln, sondern per [event delegation](https://molily.de/js/event-handling-effizient.html#delegation){:@en hreflang="de"}. LLAP 🖖 -- *„Wer durch Wissen und Erfahrung der Klügere ist, der sollte nicht nachgeben. Und nicht aufgeben.“* —Kurt Weidemann