图片变成黑白去色兼容所有浏览器实例页面

回到相关文章 »

效果:

代码:

HTML代码:
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" style="position: absolute;visibility: hidden;">
    <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>

<img src="./mm1.jpg" />
<svg xmlns:xlink="http://www.w3.org/1999/xlink" width="256" height="192">
    <image xlink:href="./mm1.jpg" x="0" y="0" width="256" height="192" filter="url('#grayscale')"></image>
</svg>