qTip即使未设置也会显示保证金?

时间:2011-03-13 14:43:33

标签: jquery css qtip

为什么即使没有为工具提示设置,qTip也会添加保证金?

这是我正在使用的qTip配置:

$.fn.qtip.styles.mystyle = { 
               width: 200,
               background: '#b7d5f4',
               color: '#212121',
               textAlign: 'left',
               border: {
                  width: 1,
                  radius: 5,
                  color: '#b7d5f4'
               },
               tip: 'bottomLeft',
               name: 'dark'
            }

            $.each($(".tooltip"), function(i,val){
                var theContent = $(val).html();
                $(val).qtip({
                     content: theContent,
                     position: {
                              corner: {
                                 target: 'topRight',
                                 tooltip: 'bottomLeft'
                              }
                           },
                     style: 'mystyle'
             });
});

内容div的类样式如下所示:

.ttContent
{
    width:                  200px;
    margin-left:           -8px;
    margin-top:            -15px;
}

为什么我必须使用负保证金来获得适当的保证金?

1 个答案:

答案 0 :(得分:2)

你走了:

$.fn.qtip.styles.mystyle = {
    /*width: 200,*/
    background: '#b7d5f4',
    color: '#212121',
    textAlign: 'left',
    padding: 2,
    border: {
        width: 1,
        radius: 5,
        color: '#b7d5f4'
    },
    tip: 'bottomLeft',
    name: 'dark'
}

$.each($(".tooltip"), function(i, val) {

    var theContent = $(val).html();
    $(val).qtip({
        content: theContent,
        position: {
            corner: {
                target: 'topRight',
                tooltip: 'bottomLeft'
            }
        },
        style: 'mystyle'
    });
});

我删除了不间断空格,qtip宽度(扩展到内容宽度)并应用了较小的填充。

工作example