Geek Answers Handbook

How to set the z-index of a table row?

It is possible that what I am trying to accomplish is not possible, but the general idea is that when a person clicks on a table row, the page dims (like a modal one), but leaves this row visible for editing. I tried to set the z-index of the table row itself, but that didn't work. It will work if I set the table row position attribute to absolute, but it seems to completely remove the table row from the table.

+5
source share
4 answers

I can only think of more complex solutions like these:

  • You will need 3 transparent gray divs, not 1. Use the first to make the entire gray page. Set the z-index of the whole table to display it above this div. Use the 2nd div for gray over everything above your line, and the third for gray below your line, leaving only your line without gray.
  • Select the entire page. Create a duplicate single-row table that you hover over the original table. When you edit this new table, synchronize these values ​​with the base table.
+3
source

If you are using jQuery, try the following:

$("<get the tr>").css("z-index", <value>);
+2
source

,

div.milk { position:absolute; z-index:2; width:100%; height:100%; opacity:.5; }
tr.raised { position:relative; z-index:3; }

, , : , , ?

, , - . ?

* -

+1

I don’t think you can achieve the desired effect with z-index. using overlay divs to mask everything around a table row seems like a more workable approach.

0
source

More articles:


All Articles