asked on

Div within iframe

Hello Experts,

I have a page with

<div name="f1" id="f1" style="display:block">
<iframe src="src1" id="topFrame" width="100%" height="200" frameborder="0" >
</iframe>
</div>
<br>
<div name="f2" id="f2" style="display:block">
<iframe src="src2" id="mainFrame" width="100%" height="1000" frameborder="0">
</iframe>
</div>

Now I want to show some div from the top frame so that it will be visible on the page.
But it is seen only partially (inside of iframe)
How can I overlay it?
I tried z-index. But it did not help.

Jagadishwor Dulal

Why not increase the height of your f1 div;

APRESTOUS

ASKER

It does not have heigth.
Visually remains the div inside of iframe.

ASKER CERTIFIED SOLUTION

Ironhoofs

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

APRESTOUS

ASKER

I don't want to break out of iframe.
I just want to get one div overlayed.

With jquery libraries I can do it.
But it seems to be possible with css

Ironhoofs

jquery is a javascript library, so that would be essentially the same as my proposed solution. I failed to understand you where looking for a html/css only solution.

APRESTOUS

ASKER

Sorry I did not look into your code.
"I have read break out of iframe" and I though you suggest script that literrally break out of iframe.
Some sites have it to avoid that their content is shown by third party.

I'd prefer css solution a little "academically" because intuitively I expect that it exists.