1

I wan't to disable a link in my home page with the attribute selector and the pointer-events: disable; but I would like to maintain the :hover effect.

This is the CSS: 

Section#thumbnails .thumb a[title="Yorokobu"]{
    pointer-events: none !important;
    display: block !important;
    cursor: default;
  }

And this the website: www.rafagarces.com/work

Thank you!

Rafa Garcés
  • 11
  • 1
  • 3

2 Answers2

2

You could add the :hover state to a parent element. 

section#thumbnails .thumb a[title="Yorokobu"] {
    pointer-events: none !important;
    display: block !important;
    cursor: default;
}

section#thumbnails .thumb:hover a[title="Yorokobu"] {
    color: red;
}
<section id="thumbnails">
  <span class="thumb">
    <a title="Yorokobu">
      Test
    </a>
  </span>
</section>
Marijan
  • 1,825
  • 1
  • 13
  • 18
1

Here your answer:

section#thumbnails .thumb a[title="Yorokobu"]:hover {
    pointer-events: visible !important;
    cursor: auto;
}
Sunny Khatri
  • 537
  • 7
  • 15