javascript隐藏鼠标的方法
时间:2022-12-14 21:57 来源:网络整理 作者:采集插件 点击:次
今天发现项目中有一个很有意思的小功能，就是鼠标移入某个区域后自动隐藏。虽说这个小需求非常的罕见，但写起来也很简单，下面是一个示例的代码，大家可以参考一下！ javascript 隐藏鼠标的方法隐藏鼠标的示例源码 <html> <head> <title>隐藏鼠标的示例</title> <style type="text/css"> div{ width:200px; height: 200px; background-color: #f5f5f5; } </style> </head> <body> <div id="main"> <p>鼠标移动到这个地方后就会自动隐藏！</p> <p>飞鸟慕鱼博客</p> </div> <script> var main = document.getElementById('main'); main.style.cursor = 'none'; </script> </body> </html>示例演示图片： CSS cursor 属性上面的示例无非就是给div元素加个一个 css 的 cursor 属性，并把属性的值设置为 none 。如果不使用JS的话，也可以直接使用 css 属性来隐藏鼠标。 CSS隐藏鼠标的示例源码 <html> <head> <title>隐藏鼠标的示例</title> <style type="text/css"> div{ width:200px; height: 200px; background-color: #f5f5f5; cursor:none; } </style> </head> <body> <div id="main"> <p>鼠标移动到这个地方后就会自动隐藏！</p> <p>飞鸟慕鱼博客</p> </div> </body> </html> (责任编辑：admin) |