法1⃣️:
IE浏览器: filter: gray;
其他浏览器:
.gray {
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
filter: grayscale(100%);
filter: gray;
}
法2⃣️: 通过 Greyscale.js
<script src="http://james.padolsey.com/demos/grayscale/grayscale.js"></script> grayscale(document.getElementById("thisImage")); 或者 grayscale($("#thisImage"));
毛玻璃效果:blur
.gray {
opacity: 0.7;
-webkit-filter: grayscale(100%) blur(5px); /* Chrome, Opera */
-moz-filter: grayscale(100%) blur(5px);
-ms-filter: grayscale(100%) blur(5px);
filter: grayscale(100%) blur(5px);
}