Praveen Rawat
Praveen Rawat

Reputation: 734

Disable html anchor in Internet Explorer

I am getting a problem in my application, where i want to disable html anchor with css, I have seen a solution in Disable link using css, which is working fine in Chrome and Firefox, but when i am opening my page to Internet Explorer, It could not be disabling, I have gone through many links but i didn't get any solution for internet explorer, Please help me if you have any helpful link or answer. Thanks in advance

http://jsfiddle.net/7EQJp/

<a href="link.html" class="active">Link</a>

.active {
       pointer-events: none;
       cursor: default;
} 

Upvotes: 7

Views: 5649

Answers (4)

Mask5323
Mask5323

Reputation: 158

i am also facing this type problem. but i use this solution in my code and its working.

.disableButton {
    background: #e6eeee none repeat scroll 0 0;
    border: 2px solid #cdcdcd;
    border-radius: 20px/40px;
    color: #dcd7dc;
    cursor: pointer;
    font-family: arial;
    font-size: 11px;
    font-weight: bold;
    image-rendering: inherit;
    padding: 5px 30px;
    pointer-events: none;
    text-decoration: none;
    display : inline-block;
   }

Upvotes: 2

Rahul Singh
Rahul Singh

Reputation: 892

You can use pointer-events css property to disable the links but they have known issues with ie. Starting from ie 11 this property is supported. There is a little hack. You should add disabled class to links and add disabled attribute to the link then add css that is given below. Also you need to provide pointer-events none for disabled anchor attribute. After these two this should work in most browsers.

a.disabled {
    pointer-events: none;
}

a[disabled] {
    pointer-events: none;
}

See this fiddle.

Upvotes: 7

Jay
Jay

Reputation: 1678

Pointer events was originally only Mozilla. It's been adopted in -webkit- but unfortunately not in IE. And now that they have Edge. I guess it won't ever be the case.

From the MDN docs:

Warning: The use of pointer-events in CSS for non-SVG elements is experimental. The feature used to be part of the CSS3 UI draft specification but, due to many open issues, has been postponed to CSS4.

Upvotes: 2

Nikson K John
Nikson K John

Reputation: 461

CSS way to disable links:

a[disabled]{
pointer-events: none;}

else you can use javascript to disable links:

$("td > a").attr("disabled", "disabled");

Upvotes: 2

Related Questions