Bug Tracker

Opened 11 years ago

Closed 11 years ago

Last modified 11 years ago

#11026 closed bug (invalid)

issue with appendTo/prependTo and z-index

Reported by: [email protected] Owned by: [email protected]
Priority: undecided Milestone: None
Component: unfiled Version: 1.3.2
Keywords: Cc:
Blocked by: Blocking:


I have below code that appends a DIV to a different DIV based on some action.

$(".personalizeflyout").prependTo("#personalizemenuitem"); $(".personalizeflyout").show();

After I show the DIV I am placing an iFrame at exact same coordinates as the personalizeflyout DIV with same width and height. Code below: $(".personalizeflyout").iFrameShim({"toppadding":60, "leftpadding":0}); jQuery.fn.iFrameShim = function() {

var o = $(this[0]) It's your element

var args = arguments[0]var itop = args.toppadding var ileft = args.leftpadding

$(".iFrameShimmer").attr("height",o.height()); $(".iFrameShimmer").attr("width",o.width()); $(".iFrameShimmer").css("top",o.offset().top + itop); $(".iFrameShimmer").css("left",o.offset().left + ileft);


This is the CSS for personalizeflyout (notice z-index 10) .personalizeflyout { margin: 0 auto; padding: 7px 0 0 0; width:434px; position: absolute; z-index:10; display:none; }

And then I have iFrame with below CSS. .iFrameShimmer { position:absolute; top: 400; left: 200; z-index:1; }

Issue Description: The z-index of iFrame and DIV seems to be getting messed up when I use the above code. But if I dont do the appendTo and run the rest of the code, the DIV is properly overlayed on top of the iFrame. Also works when I dynamically show the DIV by using show() method. I have ran some trial and errors and seems like the z-index is getting messed up when I use the appendTo or prependTo methods to attach DIV to another DIV and then place it absolutely at some location. I also tested this in version 1.6.4 and the issues exists. Please assist.

Thanks, Sridhar

Change History (2)

comment:1 Changed 11 years ago by sindresorhus

Owner: set to [email protected]
Status: newpending

Thanks for taking the time to contribute to the jQuery project! Please provide a complete reduced test case on jsFiddle to help us assess your ticket.

Additionally, be sure to test against the jQuery Edge version to ensure the issue still exists. To get you started, use this boilerplate: http://jsfiddle.net/FrKyN/ Open the link and click to "Fork" (in the top menu) to get started.

comment:2 Changed 11 years ago by trac-o-bot

Resolution: invalid
Status: pendingclosed

Because we get so many tickets, we often need to return them to the initial reporter for more information. If that person does not reply within 14 days, the ticket will automatically be closed, and that has happened in this case. If you still are interested in pursuing this issue, feel free to add a comment with the requested information and we will be happy to reopen the ticket if it is still valid. Thanks!

Note: See TracTickets for help on using tickets.