Wednesday, January 13, 2016

Zebra Striped Tables using jQuery

 $(document).ready(function () {

        $("#agTable tr:nth-child(even)").addClass("alternateRow");
        $("#agTable tr:nth-child(odd)").addClass("normalRow");


});






<style>
   table {
        border-collapse: collapse;
    }
   th{
       font-size: x-small;
   }
    table, td, th {
        border: 1px solid black;
    }

    tr.alternateRow td {
        background: #EEE;
        border-bottom: none;
        border-left: none;
        border-right: 1px solid #CCC;
        border-top: 1px solid #DDD;
        padding: 2px 3px 3px 3px;
    }

    tr.normalRow td {
        background: #FFF;
        border-bottom: none;
        border-left: none;
        border-right: 1px solid #CCC;
        border-top: 1px solid #DDD;
        padding: 2px 3px 3px 3px;
    }


</style>

No comments: