|
|||
Wie Schatten-Farbe automatisch wechseln?
Hallo,
Wie kann ich die Schattenfarbe automatisch alle paar Sekunden ändern lassen? Also von Rot zu Blau zu Grün etc. Am besten mit weichen Übergängen. Ich habe mal gelesen, dass es mit purem CSS auch realisierbar ist, weiß aber leider nicht wie. #Bild-Schatten stellt hierbei den Schatten für #Bild dar. Code:
<!doctype html> <html> <head> <meta charset="utf-8"> <title>Unbenanntes Dokument</title> <style> #Bild { width:400px; height: 200px; border: 1px solid green; background: lightyellow; margin: auto;} #Bild-Schatten { width:400px; height: 200px; box-shadow: 1px 1px 10px 5px red; margin: auto;} body { background: pink;} </style> </head> <body> <div id="Bild-Schatten"><div id="Bild"></div></div> </body> </html> Geändert von Handle3000 (19.11.2015 um 14:01 Uhr) |
Sponsored Links |
|
|||
Hab es hinbekommen. Die Übergänge muss ich noch etwas weicher gestalten, allerdings zur Orientierung für Andere vielleicht ganz hilfreich, deswegen poste ich den Code hier rein:
Code:
<!doctype html> <html> <head> <meta charset="utf-8"> <title>Unbenanntes Dokument</title> <style> #Bild { width:400px; height: 200px; border: 1px solid green; background: lightyellow; margin: auto; } #Bild-Schatten { width: 400px; height: 200px; margin:auto; box-shadow: 1px 1px 20px 3px black; animation: pulse 5s infinite; } @keyframes pulse { 0% { -webkit-box-shadow: 1px 1px 20px 3px lightyellow; -moz-box-shadow: 1px 1px 20px 3px lightyellow; box-shadow: 1px 1px 20px 3px lightyellow; } 50% { -webkit-box-shadow: 1px 1px 20px 3px orangered; -moz-box-shadow: 1px 1px 20px 3px orangered; box-shadow: 1px 1px 20px 3px orangered; } 100% { -webkit-box-shadow: 1px 1px 20px 3px yellow; -moz-box-shadow: 1px 1px 20px 3px yellow; box-shadow: 1px 1px 20px 3px yellow;"magenta"] } } body {background: pink;} </style> </head> <body> <div id="Bild-Schatten"> <div id="Bild"> </div> </div> </body> </html> |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Hintergrund Farbe wechseln mit Javascript Frage | einfachder | Javascript & Ajax | 4 | 15.02.2009 13:31 |
Schatten für Bilder | Flunder | CSS | 7 | 11.02.2009 21:30 |
Schaltflächen - Farbe wechseln! | timbo | CSS | 4 | 03.01.2007 15:57 |
Mehrere Content-<div>s mit Schatten drum herum | Deever | CSS | 2 | 06.12.2006 16:40 |
http://csskueche.xhtmlforum.de/index.php?css=2 -Terry- | terrikay | http://csskueche.xhtmlforum.de/ | 8 | 19.05.2005 14:03 |