Search code examples
c#asp.netimagetooltip

ASP.NET Dynamic Image ToolTip Not Displaying Within Table


I have a ASP.NET / C# page where there are multiple tables with an image being loaded into the header. These tables are added dynamically to the page (via the c# code-behind). The images are supposed to be Tool-Tipped with some text, but the tips are not showing up when floating the mouse over the image.

The table is built using this basic concept:

//TABLE CREATION CODE
Table t = new Table();
TableRow tabrHeaderRow = new TableRow();
TableCell tabcHeaderCell = new TableCell();

//IMAGE CODE
System.Web.UI.WebControls.Image im = new System.Web.UI.WebControls.Image();
im.ImageUrl = @"~/img/HEL-icon.png";
im.ImageAlign = ImageAlign.Right;
//im.**add tooltip**


//Add Image to header of table
tabcHeaderCell.Controls.Add(im);              

TableCell tabcHeaderCell2 = new TableCell();
tabrHeaderRow.Cells.Add(tabcHeaderCell);
tabrHeaderRow.Cells.Add(tabcHeaderCell2);


t.Rows.Add(tabrHeaderRow);

Attempts for adding tooltip:

im.ToolTip = "TipThisPlz";
im.Attributes.Add("alt", "TipThisPlz");
im.AlternateText = "TipThisPlz";

I have tried various approaches and none seem to get the tooltip to display. Every time, the image will appear, and when I "ViewSource" on the page, it loads correctly and shows either the "alt" or "title" property as being set, but the ToolTip will never display when floating the mouse over the image.

I did some brief experimentation with the "z-index" property, but it didn't seem to help me at all.

Any suggestions on what could be causing the ToolTip not to display when being dynamically added?

NOTE: Adding an < ASP:Image> to the markup with an AlternateText works perfectly fine on the page.

BROWSER OF INTEREST: IE9


Solution

  • It turns out that there was a some CSS effecting the layering of the controls. Therefore, the image was not able to have the mouse float over it since it was in the back and the table was in the front.

    The "Z-Index" was the property that was preventing the tooltip from displaying.