August 16, 2011
Using jQuery and CSS we can change the colour of alternate rows in a table. The code below will lock on to each table row and change the background colour on alternate rows. I’m making the change with CSS but you could always add a CSS class instead.
jQuery('table tr').each(function(i, domEle) { /* skip the first row (probably your headings) */ if ( i!=0 ) { /* if i / 2 has no remainer set the background to this */ if ( i%2==0 ) { jQuery( domEle ).css('background-color','#dcddde'); } else /* if i / 2 does have a remainder change the colour to this */ { jQuery( domEle ).css('background-color','#f3f3f4'); } } });
If you want add a class instead replace
jQuery( domEle ).css('background-color','#f3f3f4'); /* with */ jQuery( domEle ).addClass('odd');Filed under: Programming — Tags: background, color, colour, javascript, jquery, table, wordpress — admin @ 8:19 pm
No comments yet.
RSS feed for comments on this post. TrackBack URL
Handy tools for creating the various cards the game uses, dungeon, magic, event and treasure
Create your own unexpected event cards
Create your own monster event cards
Powered by WordPress