ExtJS Quicktip constrains problem

2020-07-27 03:07发布

问题:

I've got a column renderer defined that creates a HTML fragment which contains the ext.qtip attributes to create a quicktip. All works fine, the image renders in the grid cell, when i hover over the image a tooltip with the larger image is shown ... all nice but the quicktip on the bottom row expands beyond the constraints of the panel, is there any way to make it stay inside the panel boundaries?

var thumbRenderer = function(value, meta, record){
    var thumbPath   = Config.baseUrl + 'images/thumb/' + record.get('filename');
    var previewPath = Config.baseUrl + 'images/big/' + record.get('filename');
    return String.format('<img src="{0}" ext:qwidth="312" ext:qtip="<img style=\'margin: 2px 0;width:300px;\' src=\'{1}\' />" width="60" class="pic" />', thumbPath, previewPath);
}

回答1:

You may want to look at the showAt method:

tip.showAt([x,y]);

Where x and y are the respective x and y co-ordinate positions.

EDIT: You can also use the showBy() method on a QuickTip instance:

http://dev.sencha.com/deploy/dev/docs/source/Tip.html#method-Ext.Tip-showBy



标签: tooltip Extjs