How to disable hover or click in a website

Hello reader, Welcome to this post. Hope all of you are well and learning more. Sometimes we want to disable click  or   hover  in our website. That's why I'm writing this post for you. I hope you will be able to disable click or hover in a specific part of your website.




Outcomes:
  • How to disable click in html
  • How to disable hover
  • How to disable left click in a webpage

The Code we will use:
  • pointer-events:none;

So, If we want to disable hover or click on all anchor we should just write this css property.

       a {pointer-events:none;}   


Lets see more example:



Try this bellow code:


1:  <html>  
2:       <head>  
3:       <title>h</title>  
4:  <style>  
5:  a{margin:10px;padding:10px;background:#DD5044;color:#fff;float:left;font-size:20px;}  
6:  a:hover{background:#FB8125;}  
7:  a.no{pointer-events:none;}  
8:  p{margin-top:50px;overflow:hidden;pointer-events:none;}  
9:  </style>  
10:       </head>  
11:       <body>  
12:  <a href="www.sharwar.blogspot.com" > You Can Click me </a>  
13:  <a class="no" href="www.sharwar.blogspot.com"> You Can't Click me </a>  
14:  <a href="www.sharwar.blogspot.com" > You Can Click me </a>  
15:  </body>  
16:  </html>  

Comments