Wednesday, January 06, 2010

Style your HTML tables

I use the following CSS on my TR of TBODY in a table to help user to identify rows under inspection. On mouse over the row turns to light green and on double click it holds an orange color helpful for comparing rows.

I hate to add any intrusive JavaScript libraries and keep my table very simple.

onmouseover="if(this.style.backgroundColor!='orange'){this.style.backgroundColor='lightGreen';}" onmouseout="if(this.style.backgroundColor=='lightgreen'){this.style.backgroundColor='';}" ondblclick="if(this.style.backgroundColor=='lightgreen'){this.style.backgroundColor='orange';}else if(this.style.backgroundColor=='orange'){this.style.backgroundColor='';}"

No comments:

Post a Comment

Thank you for your feedback