EasyUI Forum

General Category => Bug Report => Topic started by: omhardb on July 31, 2014, 01:16:36 PM



Title: Tooltip Error: First, It shows in a single line and then, in multiple lines
Post by: omhardb on July 31, 2014, 01:16:36 PM
I try to put a tooltip in each item of a combo but the tooltip don't works fine when it's created.

In order to create tooltips I get the panel of the combo:

Quote
var comboPanel = $('#' + comboName).combobox('panel');

Then find divs with combobox-item class and for each of them I create each tooltip:

Quote
comboPanel.find ('div.combobox-item').each (function (index) {
   var $item = $(this);
   var title = "";
   .... (in this part, I get the title value for each item)
                
   $item.tooltip({
          position: 'right',
          content: '<span style="font-size: 87%;">'+title+'</span>'
   });
});

When I dropdown the combo and put the mouse over item, in a first time the tooltip looks in the left (no 'right') and in a single line (see the first attachment). When I put the mouse over the same item in a second time the tooltip looks in the rigth and in multiple lines (see the second attachment).

I believe this could be a mistake in the creation or viewing of the tooltip.

Regards,



Title: Re: Tooltip Error: First, It shows in a single line and then, in multiple lines
Post by: stworthy on August 01, 2014, 12:39:59 AM
If the tooltip displaying on the right exceed the edge of page, it will try to adjust to display on the left. Your tooltip message is too long to display in single line, a possible solution to solve this issue is to limit the tooltip width.
Code:
   $item.tooltip({
          position: 'right',
          content: '<div style="max-width:200px;font-size: 87%;">'+title+'</div>'
   });