disable body when iframe window is open

Question

I want to make a box, for some subscription purpose. How it should be :

• When a user clicks a button
• A iframe window opens
• And the user is able to insert data in the fields.

It looks pretty simple and actually it really is.
With the use of jquery and css i could create a iframe box. But, the real problem i faced was this :

• The user has opened the window within the page
• But, he could still select the background links.

So, i need to disable the body or something like unclickable, when the iframe is opened.

Answer 1

Put a DIV over the whole page when the iframe is open.

<div class="cover"></div>


.cover {
     position:fixed;
     top:0;
     bottom:0;
     left:0;
     right:0;
     z-index:2;
     color:rgba(0,0,0,0.3)
}

...just give your iframe a higher z-index.