如何在qTip2 jquery插件中设置样式?

时间:2015-09-24 19:39:25

标签: jquery qtip2

我有以下代码:

$('a.phonetooltip').qtip({ // Grab some elements to apply the tooltip to
content: {
    text: 'Clicking this link will only work on mobile devices',
    style: { classes: 'qtip-dark' }

}
})

我多年来一直试图将默认样式更改为黑暗样式,但我无法使其工作。它始终显示默认样式。

在qTip2指南上说:

/* Basic styles */
.qtip-light{} /* Light coloured style */
.qtip-dark{} /* Alternative dark style */
.qtip-cream{} /* Cream-esque style, similar to the default */
.qtip-red{} /* Alert-ful red style */
.qtip-green{} /* Positive green style */
.qtip-blue{} /* Informative blue style */

/* CSS3 styles */
.qtip-rounded{} /* CSS3 border-radius class for applying rounded corners to your tooltips */
.qtip-shadow{} /* CSS3 box-shadow class for applying shadows to your tooltips */
.qtip-bootstrap{} /* Twitter Bootstrap style */
.qtip-youtube{} /* Google's new YouTube style  */
.qtip-tipsy{} /* Minimalist Tipsy style */
.qtip-tipped{} /* Tipped libraries "Blue" style */
.qtip-jtools{} /* jTools tooltip style */
.qtip-cluetip{} /* Good ole' ClueTip style */

但它没有提供如何实现它们的示例代码。救命啊!

1 个答案:

答案 0 :(得分:7)

可能因为style是与content分开的属性。

试试这个:

$('a.phonetooltip').qtip({

   content: {
       text: 'Clicking this link will only work on mobile devices'
   },    
   style: { 
       classes: 'qtip-dark' 
   }

})