Auf Thema antworten 2026

Beitrag

<blockquote data-quote="Myhar" data-source="post: 2148272" data-attributes="member: 134786">AW: Mouse over Effekt erstellenNatürlich, aber nur mit der CSS Eigenschaft background-image. Von einem &lt;img&gt; kannst du das src Attribut nachträglich nur per Javascript ändern. Du kannst, wenn du mit img Tags arbeitest, das große Bild einbinden, verkleinert darstellen und bei hover die ursprüngliche Größe anzeigen. Diese Lösung ist aber nicht ideal, da alle großen Bilder geladen werden und der User sich eventuell nicht für alle interessiert. Variante 1[HTML]&lt;div class=&quot;hover&quot;&gt;&lt;span&gt; &lt;/span&gt;&lt;/hover&gt;span {background-image: url(Pfad/zum/kleinen/Bild.jpg) ;}.hover:hover span{background-image: url(pfad/zum/großen/Bild.jpg);}[/HTML]Variante 2[HTML]&lt;img src=&quot;Pfad/zum/großen/bild.jpg&quot; class=&quot;hoverImg&quot; alt=&quot;Sinnvoller Alt Text&quot;/&gt;.hoverImg{width:100px;height:100px;display:block;}.hoverImg:hover{width:300px;height:300px;}[/HTML]</blockquote>

[QUOTE="Myhar, post: 2148272, member: 134786"] [b]AW: Mouse over Effekt erstellen[/b] Natürlich, aber nur mit der CSS Eigenschaft background-image. Von einem <img> kannst du das src Attribut nachträglich nur per Javascript ändern. Du kannst, wenn du mit img Tags arbeitest, das große Bild einbinden, verkleinert darstellen und bei hover die ursprüngliche Größe anzeigen. Diese Lösung ist aber nicht ideal, da alle großen Bilder geladen werden und der User sich eventuell nicht für alle interessiert. Variante 1 [HTML] <div class="hover"> </hover> span {background-image: url(Pfad/zum/kleinen/Bild.jpg) ;} .hover:hover span{background-image: url(pfad/zum/großen/Bild.jpg);} [/HTML] Variante 2 [HTML] <img src="Pfad/zum/großen/bild.jpg" class="hoverImg" alt="Sinnvoller Alt Text"/> .hoverImg{width:100px;height:100px;display:block;} .hoverImg:hover{width:300px;height:300px;} [/HTML] [/QUOTE]

Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.

Authentifizierung

Wenn ★ = 12, ◇ = 4 und die Hälfte von ★ zu ◇ addiert wird, was ist das Ergebnis?