Как применить CSS к подсказкам в Tabulator - PullRequest
Новая
       7

Как применить CSS к подсказкам в Tabulator

0 голосов
/ 25 марта 2020

Я хочу, чтобы к моей таблице табуляторов CSS применялся к подсказкам, появляющимся при наведении курсора на ячейки. Табулятор добавляет тег [title] всякий раз, когда пользователь устанавливает [tooltips: true]. Однако применение CSS inline является сложной задачей. Я сделал: 

div[title]:hover:after {
    content:attr(title) ;
    width: 300px ;
    background-color: black ;
    color: #fff ;
    text-align: center ;
    border-radius: 6px ;
    padding: 5px 0 ;

    /* Position the tooltip */
    top: 100%;
    left: 50%;
    margin-left: -60px;
    z-index: 1 ;
}

Я еще не определился с позиционированием или не завершил свои стили. На рисунке ниже видно, что происходит, когда я наводю курсор мыши на верхнюю левую ячейку.

enter image description here

Я получаю две подсказки - по умолчанию и мою пользовательскую. , Кроме того, настраиваемая подсказка останавливается на краю ячейки.

1 Ответ

1 голос
/ 10 апреля 2020

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

Если вы хотите пользовательскую подсказку, тогда я бы предложил использовать Custom Formatter , чтобы добавить сторонний плагин для создания всплывающей подсказки.

...