"Disabling" an HTML table with javascript

Posted by Blair Jones on Stack Overflow See other posts from Stack Overflow or by Blair Jones
Published on 2010-04-30T06:11:43Z Indexed on 2010/04/30 6:17 UTC
Read the original article Hit count: 355

Filed under:
|
|
|
|

I've seen this done in a lot of sites recently, but can't seem to track one down. Essentially I want to "disable" an entire panel (that's in the form on an HTML table) when a button is clicked.

By disable I mean I don't want the form elements within the table to be usable and I want the table to sort of fade out.

I've been able to accomplish this by putting a "veil" over the table with an absolutely positioned div that has a white background with a low opacity (so you can see the table behind it, but can't click anything because the div is in front of it). This also adds the faded effect that I want. However, when I set the height of the veil to 100% it only goes to the size of my screen (not including the scrolling), so if a user scrolls up or down, they see the edge of the veil and that's not pretty.

I'm assuming this is typically done in a different fashion. Does anyone have some suggestions as a better way to accomplish this?

© Stack Overflow or respective owner

Related posts about JavaScript

Related posts about html