Making text bold in jQuery tooltip?

Question

I am using jQuery tooltip in angular controller. I need to show some tooltip content in Bold style.

I have tried the following content function, It's giving some error.

jQuery( function() {
            jQuery( document ).tooltip({
                tooltipClass: "custToolTip",
                style: {
                  height: 300,
                  overflow: 'auto'
                },
                position: {
                    my: "left-50 bottom-15",
                    at: "bottom right",
                    collision: 'none'
                }
                content: function() {
                  return jQuery(this).prop('title');
                }                    

            });
        });

After adding that content element,It's giving some error. Is something am I doing wrong?

Answer 1

What is the error that it's giving?

After a quick first look there seems to be a comma missing between position and content .

Answer 2

Try:

jQuery( function() {
            jQuery( document ).tooltip({
                tooltipClass: "custToolTip",
                style: {
                  height: 300,
                  overflow: 'auto'
                },
                position: {
                    my: "left-50 bottom-15",
                    at: "bottom right",
                    collision: 'none'
                },


      content:{ 
         function() {
                      return jQuery(this).attr('title');
                    }  
      }    });

Answer 3

I think this line has some issue return jQuery(this).prop('title'); . Just change it to return jQuery(this).attr('title'); . May work. I am referring this site. check this . It may help. https://jqueryui.com/tooltip/#custom-content