Question

我对这个example.

的工具提示感兴趣

我当前的q提示是用于表格单元格。

$(document).ready(function()
{
     $('td[title]').qtip();
});

如何修改它以获得与示例相同的效果？

感谢。

Answer 1

将示例中引用的样式对象直接传递给.qtip（）方法。如果记忆服务：

$('td[title]').qtip({
    content: {
        text: 'Neat!'
    },
    style: {
        tip: 'leftMiddle',
        border: {
            width: 10,
            radius: 6,
            color: '#FA6900'
        },
        background: '#F38630',
        color: '#333'
    }
});

编辑：我还应该提到除非您指定要放在工具提示中的内容，否则您将看不到任何内容。这通常也是在传递给qtip的配置对象中完成的。更新了我的例子。

Answer 2

使用qtip2而不是qtip1将解决问题。

CSS：

.tdStyle{
     background: #123456;
     color: #FEDCBA;
     text-align: left;
     border-radius: 4px;
     border: 2px solid white;
     width: 400px;
       };

JS：

$('td[title]').qtip({
style: {
    classes: 'tdStyle'
}
});

使用q tip自定义工具提示

2 个答案: