firefox svg gri tonlama sorunu - görüntü bulanıklaşıyor ve vardiya var

Vurgulu üzerinde gri tonlamalı efekt almak için aşağıdaki CSS'yi kullanıyorum. Firefox'taki sorun, görüntüyü hafifçe bulanıklaştırması ve aynı zamanda 1–2 piksel sağa kaydırmasıdır. Bunun neden böyle olduğundan emin değilim.firefox svg gri tonlama sorunu - görüntü bulanıklaşıyor ve vardiya var

Bu bir iç sorun mu? Bunu nasıl çözebilirim?

.zd-stack img:hover { 
    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 10+ */ 
    filter: gray;      /* IE6-9 */ 
    -webkit-filter: grayscale(100%);  /* Chrome 19+ & Safari 6+ */ 
    -webkit-transition: all .6s ease; /* Fade to color for Chrome and Safari */ 
    -webkit-backface-visibility: hidden; /* Fix for transition flickering */; 
}

CSS kullanmak istiyorum, ancak bu küçük sorunu nasıl düzeltebilirim bilmiyorum!

kaynak

2013-05-07 Devender Bhandari

Eğer gerçekten bu sorun olduğunu düşünüyorsanız, lütfen http: http://bugzilla.mozilla.org http://bugzilla.mozilla.org –

bir fs gibi bir hata gibi görünüyor, ff için belirli css anlamına gelir ve başka bir hover tarzı eklemek için iyi görünüyor . Çapraz etki alanı css svg ile ilgisi var mı? ... ama yine de onu kaldırdım. –

Bu senin cevabın mı? http://stackoverflow.com/a/32391958/241291 – cobaltduck

Firefox ve SVG gri tonları arasındaki sorun şimdi giderilmiş gibi görünüyor.

kod örneği ile keman bakınız: https://jsfiddle.net/tzi/rjotsz0p/

Firefox sürüm 35 (2015 Ocak) den grayscale() filtreyi destekler, şimdi bu kodun çok daha iyi bir sürümüne sahip böylece:

https://jsfiddle.net/tzi/x6xcx68g/

.zd-stack img { transition: filter .6s ease; /* Standard (all but IE10+) */ } .zd-stack img:hover { filter: gray; /* For IE6-12 */ filter: grayscale(100%); /* Standard (only FF35+ & IE13+) */ -webkit-filter: grayscale(100%); /* For Chrome, Safari & Opera */ }

bu yeni kodu ile keman bakın

kaynak

2015-12-23 10:30:27 tzi

firefox svg gri tonlama sorunu - görüntü bulanıklaşıyor ve vardiya var

cevap

İlgili konular