DIV inside TD to make it appear correctly

Posted by Daniel Svensson on Stack Overflow See other posts from Stack Overflow or by Daniel Svensson
Published on 2010-01-28T09:04:13Z Indexed on 2010/04/17 15:43 UTC
Read the original article Hit count: 192

Filed under:
|
|

Hi,

I have a <table> generated from code-behind and now facing a problem. In one of the TD i need to have a DIV that is setup with JQuery so that when i click a link the DIV slideToggles. Now i need the TD belonging to that TR not to expand the TR.

To solve this i have used an old trick that is to place the JQuery DIV inside another surrounding DIV with height 1px and make the TR not expanding with the heigth of the DIV that slides out.

In IE the sliding DIV is partially under the table and in Firefox the DIV appears over the table but it's trasparent, the text from the data in the table shows thru.

I have tried to alter the Z-index in various ways but it's no good.

Anyone that has an idea or alternatively solution that has worked for them.

HtmlGenericControl containerDiv = new HtmlGenericControl("div");
containerDiv.ID = "containerDiv";
containerDiv.Style.Add(System.Web.UI.HtmlTextWriterStyle.Width, "100%");
containerDiv.Style.Add(System.Web.UI.HtmlTextWriterStyle.Height, "1px");
containerDiv.Style.Add(System.Web.UI.HtmlTextWriterStyle.ZIndex, "999");
HtmlGenericControl innerDiv = new HtmlGenericControl("div");
innerDiv.ID = System.Guid.NewGuid().ToString() + "_annualDiv";
inner.Style.Add(System.Web.UI.HtmlTextWriterStyle.Width, "100%");
innerDiv.Style.Add(System.Web.UI.HtmlTextWriterStyle.Height, "300px");
innerDiv.Style.Add(System.Web.UI.HtmlTextWriterStyle.ZIndex, "1000");
innerDiv.Style.Add(System.Web.UI.HtmlTextWriterStyle.BorderStyle, "solid");
innerDiv.Style.Add(System.Web.UI.HtmlTextWriterStyle.BorderColor, "Black");
innerDiv.Style.Add(System.Web.UI.HtmlTextWriterStyle.BorderWidth, "1px");
innerDiv.Style.Add(System.Web.UI.HtmlTextWriterStyle.BackgroundColor, "white");
innerDiv.InnerHtml = "Here is a list of links coming later";
conDiv.Controls.Add(innerDiv);

© Stack Overflow or respective owner

Related posts about div

Related posts about jQuery