Как привильно использовать filter в FF?

Question

[onahapa]

Друзья, в Хромуле все работает, а ОгоньЛиса отказывается кушать(про братьев Ослика и Ишака я вообще промолчу :) ).

.k { 
  background: url(../2.jpg) repeat scroll 0 0 / 100% 100% rgba(0, 0, 0, 0); 
  height: 100%;
  width: 50%;
  position: absolute;
  -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  transition: 0.5s all;
}
.k:hover { -webkit-filter: grayscale(0%); -moz-filter: grayscale(0%);}

Как вы поняли, мне нужно сделать картинку ч/б, а при наведении цветной, причем не резко, а плавно.

Answer 1

[Александр Таратин]

Использйте svg фильтры
https://developer.mozilla.org/en-US/docs/Web/CSS/filter

Comments

[onahapa]

Забыл об этом написать. Я использовал их, но когда применял transition: 0.5s all;, он не работал

[Александр Таратин]

onahapa: codepen.io/cleric/pen/jwqyA

[onahapa]

Александр Таратин: а без JS ни как? :(

[Александр Таратин]

onahapa: Не знаю.

[onahapa]

Александр Таратин: понял, спасибо =)