Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to disable clicking inside div

For many reasons I need to disable clicking on certain content within a div element. Due to clicking ads attacks, for example. I still want it to be visible tho.

Consider the following snippet :-

<div class="ads"> something should be here, i do not want to be clicked </div> 

how to disable the abilities of left-clicking whithin that div?

like image 940
Reham Fahmy Avatar asked Jan 22 '15 07:01

Reham Fahmy


People also ask

How do I disable a div?

To disable div element and everything inside with CSS, we set the pointer-events CSS property of the div to none . to disable pointer events on the div with pointer-events set to none with CSS.

How do I stop my div from clicking outside?

You can create a div with fixed position that spans the entire screen and place what you want to be able to click inside of it, making all the clicks outside that element actually be on that "empty" div.


Video Answer


1 Answers

The CSS property that can be used is:

pointer-events:none 

!IMPORTANT Keep in mind that this property is not supported by Opera Mini and IE 10 and below (inclusive). Another solution is needed for these browsers.

jQuery METHOD If you want to disable it via script and not CSS property, these can help you out: If you're using jQuery versions 1.4.3+:

$('selector').click(false); 

If not:

$('selector').click(function(){return false;}); 
  • Referenced from : jquery - disable click

You can re-enable clicks with pointer-events: auto; (Documentation)

Note that pointer-events overrides the cursor property, so if you want the cursor to be something other than the standard cursor, your css should be place after pointer-events.

like image 183
Aviad Avatar answered Sep 28 '22 01:09

Aviad