javascript - CSS -webkit-filter 在 Chrome 22.0 中不起作用

Question

我有这段代码，但它无法在 Chrome 22.0.1229.94 m 上运行。

<div id='botonera'>
    <button id='restaurar'>Restaurar</button>
    <button id='blur'>Blur</button>
    <button id='greyscale'>Greyscale</button>
    <button id='sepia'>Sepia</button>
</div>

<script type="text/javascript">
    var imagen = document.getElementById('imagen');

    document.getElementById('restaurar').onclick = function() {
        imagen.className = 'restaurar';
    }
    document.getElementById('blur').onclick = function() {
        imagen.className = 'blur';
    }
    document.getElementById('greyscale').onclick = function() {
        imagen.className = 'greyscale';
    }
    document.getElementById('sepia').onclick = function() {
        imagen.className = 'sepia';
    }
</script>

只有灰度不起作用，模糊、棕褐色和“恢复”工作得很好。谢谢!

Answer 1

您可能正在拼写 gr<b>a</b>yscale作为gr<b>e</b>yscale在你的 CSS 中。两种拼写都正确，但只有第一种有效。

.greyscale {  
   -webkit-filter: grayscale(100%);
}