[Isomorphic]

Add a redraw before the call to placeNear(). The canvas has not yet redrawn to show the new content, so the size is stale, breaking automatic placement.

[picasso566]

Add a redraw before the call to placeNear(). The canvas has not yet redrawn to show the new content, so the size is stale, breaking automatic placement.

OK great, that's working. Now the issue is that sometimes the hover contains a link to an image and sometimes not. I also have CSS for the hover contents I would "like" to apply (but not required).

What's happening is that the hover opens with a height and width which does not expect an image to be in the canvas. So when the image loads all you can see is a portion of the image and nothing else. I've tried the following:

I put this on the ListGrid:

hoverCanvasDefaults: {
        defaultWidth: 400,
        defaultHeight: 500,
        baseStyle: "canvasHover",
        align: "center",
        valign: "top",
        opacity: null
    },

Within the hoverTest method I set a height and width:

hoverTest: function(rpcResponse, data, rpcRequest) {


    isc.Hover.hoverCanvas.setContents(data);
    isc.Hover.hoverCanvas.width = 400;
    isc.Hover.hoverCanvas.height = 500;
        isc.Hover.hoverCanvas.redraw();
       
        isc.Hover.hoverCanvas.placeNear(isc.EventHandler.getX(), isc.EventHandler.getY());
    },

This works for the width of the hover but not the height. Any ideas?

[Isomorphic]

If you're able to add a height and width to the <img> tag in the HTML, that would solve the problem and is the simplest approach.

Otherwise, fundamentally the issue is that no auto-sizing strategy can work until the browser loads the image data and so you need to defer placing the hover until the image has loaded. Given the imageURL, the perfectly correct solution would be to use FileLoader.cacheFiles(imageURL) and call adjustForContent() and placeNear() on the hover only once the image had been loaded. Hopefully the simpler solution of a height and width in the HTML is workable for you.

[picasso566]

In this particular case the images are a standard width and height. I have another portion of the site that requires variable heights/widths. We'll cross that road when we come to it.

Thanks for your help!