Input box on top of layer

itHighway · December 14th, 2008, 02:40 PM

Hello,

I have developed a registration page which is full of input fields. The problem is when I open a layer (<div></div) on that page, input boxes remain on top of the page.

How should I resolve this issue?

Thank you,
Zeeshan Dar

Old Pedant · December 17th, 2008, 10:41 PM

I assume you mean <SELECT> fields. Those are the only ones I am aware of that ALWAYS "show through". And even that only happens in MSIE version 6 and before, so far as I know.

But the answer is pretty simple: Hide the fields using JavaScript when you display the overlay <DIV>. That is, just change them to
fld.style.visible='hidden';

itHighway · December 18th, 2008, 04:35 PM

Thanks for your response. One more question:

If you browse www.elance.com and click on "Sign in or Register" link at top right corner, it will open a new layer or window. My questions are:

- Is this new popup window is a layer?
- When you take mouse cursor on top of it, the mouse cursor change and you can move this window any where on the page. Any idea how?
- The drop down menu and search text box hide behind this layer. Any idea how?

Thank you.
Z

Old Pedant · December 18th, 2008, 09:17 PM

> - Is this new popup window is a layer?

What do you think? Here's part of the code for it:

Code:

<div id="signInPanelDiv" class="signinpanel displayNone">
    <div class="hd"><div class="header" style="float:left">Please Sign In</div>...

> - When you take mouse cursor on top of it, the mouse cursor change and you can move this window any where on the page. Any idea how?

Yes, drag and drop. Most browsers allow JavaScript to do this.

> - The drop down menu and search text box hide behind this layer. Any idea how?

Not off the top of my head. It's surprising how well it works. Enough so that someday I may take the time to figure it out.

itHighway · December 27th, 2008, 06:54 AM

Thanks for your response "Old Pendant". Thank you very much.