pointer-events:none prevents title attribute

user_5602577 0
Viewed 12646

I am having an anchor tag, which should not be clicked so i have added pointer events none.i have a title attribute on the anchor tag need to be shown while hovering. pointer-event:none prevents the title tag from showing up.Is there a way to have both pointer-events:none and title showing up.

a{
  pointer-events:none;
}
<a href="https://stackoverflow.com/" title="Some Sample Title"> Sample Link </a>

css html
2 Answers

No, pointer-events: none is pretty encompassing in that any eventType that is associated with the mouse. You could wrap a <span> around the anchor and assign the title to that instead. It's ugly but valid.

Demo

a {
  pointer-events: none;
}
<span title='I am wrapped around this anchor'>
<a href="https://stackoverflow.com/" title="Some Sample Title">Sample Link</a>
</span>

user_28132240

According to: https://css-tricks.com/almanac/properties/p/pointer-events/, I think pointer-event has a very specific use.

If you want interact with the mouse cursor you have cursor attribut and in your case:

a:hover{
  cursor:default;
}
<a href="https://stackoverflow.com/" title="Some Sample Title"> Sample Link </a>

user_71523540
Related