Is it possible to hide the title from a link with CSS?

后端 未结 5 942
孤独总比滥情好
孤独总比滥情好 2020-12-06 04:17

I have an anchor element with a title attribute. I want to hide the popup that appears when hovering over it in the browser window. In my case, it is not possible to do some

相关标签:
5条回答
  • 2020-12-06 04:41

    In CSS it's not possible, because you can only add contents to DOM (tipically with :before :after and content: '...';, not remove or change attributes.

    The only way is to create a live custom event (es. "change-something"):

    $("a").on("change-something", function(event) { this.removeAttr("title"); });

    and trigger to every changes:

    ... $("a").trigger("change-something");

    More information and demo here:

    http://api.jquery.com/trigger/
    http://api.jquery.com/removeAttr/

    0 讨论(0)
  • 2020-12-06 04:48

    Using the following CSS property will ensure that the title attribute text does not appear upon hover:

    pointer-events: none;
    

    Keep in mind that JS is a better solution since this CSS property will ensure that the element is never the target of any mouse events.

    0 讨论(0)
  • 2020-12-06 04:52

    You can wrap your inner text in a span and give that an empty title attribute.

    <a href="" title="Something" class=".some-tooltip-class"><span title="">Your text</span></a>
    
    0 讨论(0)
  • 2020-12-06 04:53

    try to change your code using this

    $(document).ready(function() {
        $("a").removeAttr("title");
    });
    

    this will remove title attribute so the hint label won't be appear when hover on the link

    0 讨论(0)
  • 2020-12-06 05:00

    As per @boltClock's suggestion, I'll say I don't feel that a CSS solution is appropriate here, as the browser decides what to do with the title attribute of a link, or anything for that matter. CSS, to my knowledge, is unable to handle this issue.

    As mentioned, using jQuery to replace the title with an empty string wont work because jQuery mobile rewrites them at some points. This, however, will work independently of JQM, and doesn't involve entirely removing the title attribute which is SEO important.

    This works:

    $('a["title"]').on('mouseenter', function(e){
        e.preventDefault();
    });
    

    I changed my initial code of $('body').on('mouseenter') to this after testing. This is confirmed to work.

    0 讨论(0)
提交回复
热议问题