CODEWITHSUNDEEP
htmlcss
Willy David Jr
Willy David Jr

Reputation: 9161

Disable Link Using CSS but Enable Title

I want to enable link using CSS but still enable title. Here is my code:

CSS and HTML Code:

.disabledLink {
   pointer-events: none;
   opacity: 0.6;
   cursor: default;
 }
<a href="www.google.com" class="disableLink" title="My Title" /> 
  <span datahover="test">My Link</span> 
</a>

Unfortunately, title is not appearing when hovering my mouse to the link. Is there a better way to enable title?

Upvotes: 1

Views: 13415

Answers (2)

hdotluna
hdotluna

Reputation: 5732

.disabled-link {
  pointer-events: none;
}
<span datahover="test" title="My Title"><a href="www.google.com" class="disabled-link">My Link</a></span>

Change your markup into this. It will work. Instead of targeting <a> tag, I target the span for title. Hope it helps.

Upvotes: 19

Siraj Hussain
Siraj Hussain

Reputation: 874

You should put your span tag inside the link tag, like this:

<a href="www.google.com" class="" title="My Title"> <span datahover="test">My Link</span> </a>

Upvotes: 0

Related Questions