Можно ли скрыть заголовок от ссылки с помощью CSS?

У меня есть якорный элемент с атрибутом title. Я хочу скрыть всплывающее окно, которое появляется при зависании над ним в окне браузера. В моем случае невозможно сделать что-то вроде этого,

$("a").attr("title", "");

Из-за jQuery Mobile заголовок будет появляться после появления определенных событий (в основном каждый раз, когда элемент привязки перерисовывается). Поэтому я надеюсь скрыть заголовок с помощью CSS.

Что-то вроде:

a[title] {
    display : none;
}

не работает, поскольку он скрывает весь элемент привязки. Я хочу скрыть только заголовок. Возможно ли это? Всплывающее окно не должно отображаться.

Ответ 1

Использование следующего свойства CSS гарантирует, что текст атрибута title не появляется при наведении:

pointer-events: none;

Имейте в виду, что JS является лучшим решением, так как это свойство CSS гарантирует, что элемент никогда не является объектом каких-либо событий мыши.

Ответ 2

В соответствии с предложением @boltClock, я скажу, что я не считаю, что здесь подходит CSS-решение, так как браузер решает, что делать с атрибутом title ссылки, или что-то в этом роде. Насколько мне известно, CSS не может решить эту проблему.

Как уже упоминалось, использование jQuery для замены заголовка пустой строкой не будет работать, поскольку в некоторых случаях jQuery mobile переписывает их. Это, однако, будет работать независимо от JQM и не предполагает полного удаления атрибута title, что важно для SEO.

Это работает:

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

Я изменил свой исходный код $('body').on('mouseenter') на этот после тестирования. Это подтверждается на работу.

Ответ 3

Вы можете обернуть свой внутренний текст в промежутке и дать ему пустой атрибут title.

<a href="" title="Something" class=".some-tooltip-class"><span title="">Your text</span></a>

Ответ 4

В CSS это невозможно, потому что вы можете только добавлять содержимое в DOM (обычно с :before :after и content: '...'; не удалять или изменять атрибуты.

Единственный способ - создать живое настраиваемое событие (например, "change-something"):

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

и вызвать для каждого изменения:

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

Больше информации и демо здесь:

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

Ответ 5

попытайтесь изменить свой код, используя этот

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

это приведет к удалению атрибута title, чтобы метка подсказки не отображалась при наведении на ссылку