how to revert back to normal after display:none for table row

Basically, I have a table. Onload, I set each row of the table to display:none since I have a lot of javascript processing to be done and I don't want user to see it while it is being done. I've set a timer to display it after a little while, my problem is that i can't get the table row to display like a table row. If I set display:block , it would just not line up with the headers (th). The only solution I've found is display: table-row from css2, but ie 7 and below does not support this declaration.

Any solution?


将显示设置为空字符串 - 这将允许行使用其默认显示值,因此适用于所有浏览器


IE7 and below use display: block for table elements; the other browsers correctly use table-row , table-cell etc.

Whilst you could browser-sniff and choose different display values, it's much easier to hide a row indirectly. Add a stylesheet rule like:

.hidden { display: none; }

and then change the className of the row element to include or not include the hidden class. When the class is removed, the display style will jump back to its default value, whichever that is on the current browser.

You can also use containment selectors to hide multiple elements inside one element, then make them all visible/hidden at once by changing one class. This is faster than updating each style separately.

i have a lot of javascript processing to be done and i don't want user to see it while it is being done.

They generally won't anyway. Changes usually don't render on-screen until control has passed out of your code back to the browser.


为什么不把表格放在一个div中,使div的显示为none ,当处理完成时,将div的显示设置回blockinline block或者你需要的任何东西......

链接地址: http://www.djcxy.com/p/75638.html

上一篇: 高度应用程序和溢出

下一篇: 显示后如何恢复正常:表格行没有