qtip bubble styling
I just picked up qtip2 plugin for JQuery and can't seem to get the style to work according to their exam开发者_开发知识库ples. Perhaps I am not understanding something?
This is their example for loading the 6 default available themes, but it does not change anything whether I use cream, red, dark, light, blue or green. I just keep getting the default cream theme. These should have also already been available and usable since qtip 1x?
$("jqueryselector").qtip({
content: 'Dark themes are all the rage!',
style: {
name: 'dark' // Inherit from preset style
}
});
My code is as follows in the JQuery:
$(function(){
$('a['title']).qtip({style:{name:'red',tip:true}}); // picked up from the getting started page
});
That way of styling the tooltip applies to the original version of qtip
which is now superseded by a newer version. qtip2
uses a better class based styling method.
$('.selector').qtip({
content: {
text: 'I\'m blue... deal with it!'
},
style: {
classes: 'ui-tooltip-blue ui-tooltip-shadow'
}
});
You definitely want to use qtip2
. It is much improved over qtip1
.
Looks like you're missing some brackets.
$('a['title']).qtip(style:{name:'red',tip:true}); // your code
$('a[title]').qtip({ style: { name: 'cream', tip: true } }); // their code
EDIT: I used qtip a few months back and ended up doing this...
style: {
//name: 'cream',
tip: true,
background: '#E6EFF5',
color: '#297AA8',
border: {
radius: 8,
color: '#bfd8e8'
}
}
精彩评论