Можно ли создать заголовок? (и с CSS или js?)

Мне было интересно, можно ли создать стиль title:

<a href="#" title="This is a title">Hello</a>

Вопрос о стиле имеет два аспекта:

  • Текстовое форматирование/кодирование (что, я думаю, возможно, SO делает это в вопросах *).
  • Стиль подсказки, можете ли вы сделать его больше? другие цвета? и др.

И у меня есть другая проблема: как вы "укажете" на заголовок?

  • От CSS
  • От Javascript/ jQuery

Спасибо заранее!


* Что я могу выразить форматированием/кодировкой текста:

alt text

Ответы

Ответ 1

Вы можете поместить символы новой строки в свой атрибут title через объекты HTML, чтобы принудительно разбить строку в тексте. Большинство браузеров в наши дни поддерживают это. Это единственное изменение, которое вы можете внести в собственный всплывающий экран браузера.

<a href="real_link" title="check&#13;&#10;this&#13;&#10;out">foo bar</a>

См. приведенный выше пример на веб-странице.

Как отмечали другие, существует множество плагинов для различных JS-библиотек для создания настраиваемых HTML-подсказок. Вот верхний хит для поиска в Google "jQuery tooltip plugin", в котором рассматриваются 10 таких плагинов.

Ответ 2

Вы можете создавать всплывающие подсказки только для CSS, используя псевдокласс: :after и :hover:

<a href="#" class="class-with-tooltip">Link</a>
.class-with-tooltip:hover:after{
    content: 'Tooltip';
    position: absolute;
    padding: 5px;
    border: 1px solid gray;
    background: whitesmoke;
    font-size: 14px;
}

Я не уверен, как это будет работать в старых браузерах, но оно работает во всех основных браузерах.

position: absolute; необходим, чтобы предотвратить сгенерированный контент после разметки после элемента.

Ответ 3

В CSS это невозможно, так как всплывающее окно всплывающей подсказки - это родная ОС, но, пожалуйста, ознакомьтесь с этим руководством (статья + скринкаст + исходный код): http://net.tutsplus.com/articles/news/you-still-cant-create-a-jquery-plugin/ В нем описывается, как свернуть собственный пользовательский плагин jQuery, который будет делать именно то, о чем вы просите.

Ответ 4

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

http://www.1stwebdesigner.com/freebies/stylish-jquery-tooltip-plugins-webdesign/

Ответ 5

Вы можете сделать это с помощью jQuery, но нет необходимости в плагине.

Назначьте элемент классу, а затем, после того, как документ будет готов, установите атрибут title для этого класса. Например...

$(".className").attr("title", "Your title here.");

Ответ 6

Нет. Невозможно создать стиль атрибута title для любого элемента HTML. Тем не менее, я бы согласился с тем, что есть много плагинов jquery, доступных для стиля всплывающей подсказки с использованием атрибута title.

Попробуйте это. http://flowplayer.org/tools/tooltip/index.html