creating html element 'over' my form

sneakyimp

i have had some problems with my file upload form in safari. apparently setting the form's display property to 'hidden' or 'none' causes safari to drop information in the form.

that said, i would like a javascript function that will create an html element (div, table, paragraph, whatever) that hovers 'over' my form without affecting any properties of the original form. i imagine this can be done with layers.

can anyone recommend a really simple script to do this? ideally it would either center in the middle of my browser window or cover the entire contents currently in the window.

bradgrafelman

Cover the entire contents of the window? Well that's easy:

<div style="background-color: #FFFFFF; position: absolute; left: 0px; top: 0px; height: 100%; width: 100%">&nbsp;</div>

MarkR

Sounds like you're doing something a bit weird anyway:

Why do you want a form to still be submitted if it's invisible? Why not just use hidden inputs instead?
You claim safari drops fields if they are hidden; this sounds like a bug, have you a simple test case? Does it still happen if you hide the form by setting its container to display:none instead?
Assuming you did want to "cover over" the form with another element, you do realise that this won't work in some browser (which use native widgets).

Browsers which use native widgets can't have those widgets covered by other elements in the page (as they're rendered by the OS or a different layer anyway). This includes:
- IE6 on windows (Select elements only)
- Some other versions of IE (some other form elements)
- I believe, Konqueror (Some elements, perhaps)

Mozilla and IE7 certainly don't use native widgets at all, meaning that any element can be covered over (Possible exception: plugins).

Mark

sneakyimp

all i'm trying to do is have a form for uploading pictures that changes appearance when you click 'submit'. i wanted to hide the file input and show instead an 'uploading file...' message with a cool animated gif.

as for it being a bug with safari, yes i think so too. my form was working fine in every browser but safari and i've been searching for a solution for about 3 months now and finally stumbled across some guy's blog claiming he found the problem and it's related to form elements with style = hidden/none.

i'm not sure what you mean by 'native widgets'.

as for a test case, my original form is my current test case. it worked fine in all browsers but safari. i'm waiting for somebody with a mac to test it for me but i tried removing all the style weirdness and will report back when i hear something.