Autor Thema: Need: CSS-Gott :-D  (Gelesen 764 mal)

Online accessburn

  • Sr. Member
  • ****
  • Beiträge: 925
  • Lecker Raspberry-Cocktail!
    • TRcoding
Need: CSS-Gott :-D
« am: 14 Februar 2018, 18:28:13 »
Hallo,

ich versuche zwei Effekte auf ein hover zu legen. Scheitere jedoch.
Kann sich das mal jemand anschauen der was davon versteht? Sonst werfe ich den Mist irgendwann aus dem Fenster  >:(

https://jsfiddle.net/be0z5kzz/

Was soll es tun?
Beim hovern soll das Bild ausgrauen und die Titelbinde v.l.n.r. einfaden und das Bild wieder sauber verlassen nach dem Verlust des hovers.
Wezzy Rpi2b> FHEM, Elro, Intenso, FTUI, Jeelink v3, Max!Cube, Fire5, Foscam, NAS, Fritz!Box + Fon, Max!Wandthermostat, Amazon Echo
Wezzy Rp3b> OctoPi
Jessie Rp3b> UPNP, NAS, Pi-Hole

Offline drhirn

  • Sr. Member
  • ****
  • Beiträge: 855
Antw:Need: CSS-Gott :-D
« Antwort #1 am: 14 Februar 2018, 20:18:07 »
z.B.: https://jsfiddle.net/amyj4o78/

Ist noch Verbesserungspotential da. Da wird leider auch die Schrift ausgegraut. Das wollte ich noch verhindern. Aber mir rennt grad die Zeit davon. Kann ich mir morgen noch ansehen, wenn du möchtest.

Online accessburn

  • Sr. Member
  • ****
  • Beiträge: 925
  • Lecker Raspberry-Cocktail!
    • TRcoding
Antw:Need: CSS-Gott :-D
« Antwort #2 am: 14 Februar 2018, 21:42:05 »
geht das auch ohne die background-url sondern klassisch mit img-tag?
Wezzy Rpi2b> FHEM, Elro, Intenso, FTUI, Jeelink v3, Max!Cube, Fire5, Foscam, NAS, Fritz!Box + Fon, Max!Wandthermostat, Amazon Echo
Wezzy Rp3b> OctoPi
Jessie Rp3b> UPNP, NAS, Pi-Hole

Offline drhirn

  • Sr. Member
  • ****
  • Beiträge: 855
Antw:Need: CSS-Gott :-D
« Antwort #3 am: 15 Februar 2018, 08:37:38 »
Wird schwieriger. Aber bevor ich mir das ansehe, könntest du kurz erklären, was du damit machen möchtest? Ich befürchte nämlich, die "freie" Positionierung des ganzen Werkes könnte dann etwas schwierig werden.

Offline drhirn

  • Sr. Member
  • ****
  • Beiträge: 855
Antw:Need: CSS-Gott :-D
« Antwort #4 am: 15 Februar 2018, 09:33:48 »
Der hier ist schwer zu positionieren: https://jsfiddle.net/amyj4o78/5/
Wenn's auch sowas sein darf, da wär's leichter: https://jsfiddle.net/y0cva2m9/

Online accessburn

  • Sr. Member
  • ****
  • Beiträge: 925
  • Lecker Raspberry-Cocktail!
    • TRcoding
Antw:Need: CSS-Gott :-D
« Antwort #5 am: 15 Februar 2018, 10:56:32 »
Also die alternative Lösung sieht nicht schlecht aus. Ich müsste es mal einbauen und testen :-)
Wezzy Rpi2b> FHEM, Elro, Intenso, FTUI, Jeelink v3, Max!Cube, Fire5, Foscam, NAS, Fritz!Box + Fon, Max!Wandthermostat, Amazon Echo
Wezzy Rp3b> OctoPi
Jessie Rp3b> UPNP, NAS, Pi-Hole

 

decade-submarginal