Styling a default tooltip

Question

Using jQuery, I have implemented tooltip in my html. Now I want to style my tooltip.

How can I do that?

My JavaScript code for the tooltip is this:

$('.bootstrap-switch-handle-on').hover(function () {
    $(this).css('cursor', 'pointer')
           .attr('title', 'This is a hover text.');
}, function () {
    $(this).css('cursor', 'auto');
});

Thanks

yes I have but I have no idea how ho apply css on tool tip I have applied css on contorls only — Utpal, Mar 24 '17 at 12:06
add a class to your tooltip and use css for styling that. If I were you, I'd like the tooltip by myself not using plugins. — alireza, Mar 24 '17 at 12:20

score 0 · Answer 1 · answered Mar 24 '17 at 14:52

It looks like you are just adding the title attribute to the .bootstrap-switch-handle-on element. The subsequent "tooltip" is generated by the browser and cannot be styled. If you are using Bootstrap, you can use their built in Tooltip which can be styled with CSS. http://getbootstrap.com/javascript/#tooltips

Styling a default tooltip

1 Answers1