百搜论坛欢迎您的加入!
adimg adimg
 
昨日:篇  今日:篇   总帖:篇   会员:
博主最大Lv63   
js实现让页面元素变成灰色     

[导读] JS如何实现让页面元素变成灰色呢? 最终效果: 代码: !DOCTYPEhtmlhtmlbodyp点击按钮修改图片的颜色为黑白(100%灰度)。/pbuttononclick=myFunction()尝试一下/buttonbrimgid=myImgsrc=pineapple.jpgalt=Pineapp...

JS如何实现让页面元素变成灰色呢?

Image

最终效果:

Image

代码:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

<!DOCTYPE html>

<html>

<body>

 

<p>点击按钮修改图片的颜色为黑白 (100% 灰度)。</p>

 

<button onclick="myFunction()">尝试一下</button><br>

 

<img id="myImg" src="pineapple.jpg" alt="Pineapple" width="300" height="300">

 

<p><strong> 注意:</strong> IE 或 Firefox 浏览器不支持该属性。</p>

 

<script>

function myFunction() {

    document.getElementById("myImg").style.WebkitFilter = "grayscale(100%)"; // Chrome, Safari, and Opera

}

</script>

 

</body>

</html>

 0  已被阅读了1322次  楼主 2020-07-06 13:30:02
回复列表

回复:js实现让页面元素变成灰色

联系站长 友链申请桂ICP备19000949号-1     桂ICP备19000949号-1
您的IP:18.191.240.243,2024-04-19 11:43:10,Processed in 0.01722 second(s).
免责声明: 本网不承担任何由内容提供商提供的信息所引起的争议和法律责任。
Powered by HadSky 7.12.9
已有0次打赏
(0) 分享
分享
取消
免责声明
1、本站资源,均来自网络,版权归原作者,所有资源和文章仅限用于学习和研究目的 。
2、不得用于商业或非法用途,否则,一切责任由该用户承担 !
如果觉得本文还不错请点个赞或者打赏点轻币哦~
拒绝伸手党,拿走请回复,尊重楼主,尊重你我他~

侵权删除请致信 E-Mail:207882320@qq.com