| Autor | Zpráva | ||
|---|---|---|---|
| jefitto44 Profil |
#1 · Zasláno: 27. 11. 2014, 07:28:10
Mám stránku, kde budú čiernobiele obrázky. Oni tam teda budú umiestnené ako farebné, a pri hoveri tiež budú farebné, ale ak nebude hvoer, chcel by som, aby boli čiernobiele, resp. grayscale. Existuje na to nejaká CSS3 featura?
|
||
| Trsak Profil |
#2 · Zasláno: 27. 11. 2014, 08:51:16
Nejlepší řešení bude asi prostě si vytvořit barevný a černobílí obrázek a při hoveru je měnit.
img.greyscale { background: url(../YourBlackAndWhiteImage.png);}
img.greyscale:hover { background: url(../YourColoredImage.png};}Našel jsem ale i toto řešení: img.grayscale {
filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 3.5+ */
filter: gray; /* IE6-9 */
-webkit-filter: grayscale(100%); /* Chrome 19+ & Safari 6+ */
}
img.grayscale:hover {
filter: none;
-webkit-filter: grayscale(0%);
} |
||
| jefitto44 Profil |
#3 · Zasláno: 27. 11. 2014, 08:58:12
Tiež som našiel toto riešenie... moja otázka však je, čo je toto v url, to data... to je nejake SVG pravdepodobne, ale čo robí?
|
||
|
Časová prodleva: 9 let
|
|||
0