[Sampson]

I'm attempting to write some javascript to collapse/expand a row in a table.

I'm going to have multiple tables that are 1 column and 2 rows. The first row of each table will contain a project discription along with a collapse/expand button and the second row will contain the project details w/ image.

I already have the tables built and the css information for them worked out.

My question is if I put the javascript in the header... is each table going to need its own script?

[Transmogrify]

if you write the javascript as a class or even just a function, you could create a generic onclick event and pass the id of each table in to the function and deal with it. So no, you shouldn't have to write a separate script for each table.

[Sampson]

i think my head is about to implode...

[imagn]

You can also use JavaScript to loop through each row/cell in the table on page load. You can have the script only "read" certain cells with a specific class.

I can't post links yet so send me a message if you want code samples.

[Sampson]

Thanks! Your code will be a good reference... tho I'm trying to write everything from scratch so I can grasp the concept.

I got everything to work, but experience horrible cross-browser issues and have decided to learn laying it out in entirely css.

I have a new questions though:


I'm using DIVs and containers to organize information and i'm using absolute values to place them on the page. Now when I use javascript to hide the certain DIVs visibility.... is it going to leave an open area and not shift the other DIVs up?

How am I going to shift everything up? More javascript or use relative values(not really comfortable with them yet)?

[Transmogrify]

You might want to take a look at the prototype framework - prototypejs.org. you can add an id or class to a table row and then do something like $('some_row_id').hide(); or $$('some_row_or_rows_class').invoke('hide');

it's great.

[Sampson]

Thanks. Works well.

Now, I'm getting werid gaps between my DIVs when margins and padding is set at 0pxs. The DIVs are equal width rectangles stacked verically in a single column. They are also contained in a container. Its has be due to some sloppy coding somwhere because it doesn't make any sense.

[Sampson]

Okay, here the situation... I'm putting text into a DIV. Is it better practice to attach padding values to the div or is it better practice to attach the padding the information to the type that goes in the DIV?