1. Приветствуем Вас на неофициальном форуме технической поддержки XenForo на русском языке. XenForo - коммерческий форумный движок от бывших создателей vBulletin, написанный на PHP.

Tooltip в несколько строк

Тема в разделе "Вопросы по стилям, изменения в CSS и шаблонах", создана пользователем Barbos, 26.04.2012.

Загрузка
  1. Barbos

    Barbos Местный

    Регистрация:
    14.04.12
    Сообщения:
    115
    Симпатии:
    143
    Версия XF:
    1.1.2
    Tooltip в форуме можно использовать так:
    HTML:
    <a title="ToolTip Text 1">Text 1</a>
    tt1.png

    или так:
    HTML:
    <a class="OverlayTrigger Tooltip" title="Tooltip Text 2">Text 2</a>
    tt2.png

    а вот кто нить знает как Tooltip Text организовать в несколько строк? <br> и \r\n не проходят...
     
    Barbos, 26.04.2012
    #1
  2. CyberAP

    CyberAP Местный

    Регистрация:
    05.10.10
    Сообщения:
    2 604
    Симпатии:
    1 660
    Версия XF:
    1.5.10
    Никак, только длинный текст писать. Можно через white-space конечно попробовать, но это уже сильное извращение.
     
    CyberAP, 26.04.2012
    #2
  3. Romchik®

    Romchik® The Power of Dreams Команда форума

    Регистрация:
    26.09.10
    Сообщения:
    5 746
    Симпатии:
    5 311
    Версия XF:
    1.5.18
    Буквально сегодня разговаривал с коллегой по работе на эту тему. Щас вот проверил сам. Начиная с 12-й версии FireFox поддерживает многострочные подсказки атрибута title (как в первом варианте).

    Достаточно написать в коде с новой строки (<br /> не срабатывает):
    Результат:
    title-multilines.gif

    Как обстоит это дело в других браузерах - не знаю. Скорей всего не поддерживается.

    Работает во всех браузерах последних версий:
    • FireFox 12
    • IE9
    • Chrome 18
    • Opera 11.60
    • Safari 5.1.5
     
    Romchik®, 03.05.2012
    #3
    MEG@VOLT и Barbos нравится это.
  4. Barbos

    Barbos Местный

    Регистрация:
    14.04.12
    Сообщения:
    115
    Симпатии:
    143
    Версия XF:
    1.1.2
    Проверил на IE9, Chrome - первый вариант пашет, на втором нет, спасиб, хоть чтото..
    зы: интересно тогда почему второй вариант не пашет?
    Безымянный.png
     
    Barbos, 03.05.2012
    #4
    Romchik® нравится это.
  5. Romchik®

    Romchik® The Power of Dreams Команда форума

    Регистрация:
    26.09.10
    Сообщения:
    5 746
    Симпатии:
    5 311
    Версия XF:
    1.5.18
    Хм, получается FF не первый был, а последний. Вот уж не думал. Поправил свое сообщение по поводу поддержки браузеров.
     
    Romchik®, 03.05.2012
    #5
  6. Barbos

    Barbos Местный

    Регистрация:
    14.04.12
    Сообщения:
    115
    Симпатии:
    143
    Версия XF:
    1.1.2
    вот же я баран, ответ был под носом, а именно на булочном форуме где постоянно зависаю - и видел же это...

    forum.png

    нашел еще один вариант:
    Код:
    <a title="Первая строка.&#10Вторая строка.">Text 1</a>
    перевод строки символы - &#10
     
    Barbos, 03.05.2012
    #6
    MEG@VOLT, maus и Romchik® нравится это.
  7. Romchik®

    Romchik® The Power of Dreams Команда форума

    Регистрация:
    26.09.10
    Сообщения:
    5 746
    Симпатии:
    5 311
    Версия XF:
    1.5.18
    Да, так удобней.

    Я отсюда брал инфу в свое время, кстати.
    http://habrahabr.ru/post/137232/
     
    Romchik®, 03.05.2012
    #7
  8. CyberAP

    CyberAP Местный

    Регистрация:
    05.10.10
    Сообщения:
    2 604
    Симпатии:
    1 660
    Версия XF:
    1.5.10
    А ещё есть вариант прописать .xenTooltip {white-space: pre;} и писать так же текст с табуляцией, только при этом сохраняется внешний вид тултипа.
     
    CyberAP, 03.05.2012
    #8

Поделиться этой страницей