0

So i have a CSS menu bar and it sits in a iframe for a page. The menu works fine only the list now drops down past the iframe size on parent page. What Im looking for is a way to make the drop down list show above the content of its parent page.

I have tried using zindex with no luck it still hides in the frame!

Not sure if this is possible any help would be great.

user3293825
  • 11
  • 1
  • Do you have some code we can see, and perhaps an example? – Tony Barnes Feb 25 '15 at 11:39
  • Essentially, you want to position an element within an `iframe` so that it is positioned outside of the `iframe`? – Marc Audet Feb 25 '15 at 11:42
  • Yes Marc spot on. Tony not sure code would help as its a standard nav menu with drop down links. The problem is when they drop down they hide! – user3293825 Feb 25 '15 at 11:43
  • Perhaps the answers in this question will help you: http://stackoverflow.com/questions/3286178/can-i-apply-css-to-the-elements-within-an-iframe – lia ant Feb 25 '15 at 11:47

1 Answers1

0

The best that I can offer is an example of why this will not work.

The iframe is a self-contained unit that is rendered within its own block. Any element within the iframe that is positioned outside of the iframe block will not be visible.

In the example below, I repositioned the bold element to the left with a negative margin and you can see that the text gets clipped by the edges of the iframe.

You would need to use a jQuery AJAX call to get the source, grab the element of interest, and then insert it into the DOM of the parent page.

iframe {
  margin-left: 50px;
}
<p>Outside of the iframe.</p>
<iframe seamless sandbox="allow-same-origin"
        srcdoc='<p>Yeah, you can see it 
        <a href="/gallery?mode=cover&amp;page=1">in my gallery</a>.
        <b style="position: absolute; top:0; left: -20px;">
          Some bold text.</b>'>
</iframe>
Marc Audet
  • 46,011
  • 11
  • 63
  • 83
  • 1
    Thanks Marc this will never wok i have had to change from iframe to and include file now. Took a bit of work but got it working as i want. – user3293825 Feb 25 '15 at 12:42