Neler yeni
Türkiye'nin En Güncel Forum Sitesi

Forum içeriğine ve tüm hizmetlerimize erişim sağlamak için foruma kayıt olmalı yada giriş yapmalısınız. Forum üye olmak tamamen ücretsizdir.

Tablo Satır ve Sütun Renklendirme (ing)

ByOnur58

Kayıtlı Üye
MFC Üyesi
  • Üyelik Tarihi
    7 Ocak 2015
  • Mesajlar
    2,113
  • MFC Puanı
    10
  • MFC Seviyesi

Kod:
<style media="all" type="text/css">

    body, html {
    
        font-family: Tahoma, sans-serif;
        font-size: 11px;
        color: #EEEEEE;
        background-color: #2A2A2A;
    
    }
    
    td {
    
        width: 50px;
        border: 1px solid #999999;
        cursor: pointer;
        text-align: center;
    
    }
    
    .row {
    
        background-color: #444444;
    
    }
    
    .rowhighlight {
    
        background-color: #666666;
        font-weight: bold;
    
    }

</style>
<script language="javascript" type="text/javascript">

    var tablewidth = 4;
    var tableheight = 4;

    function cellevent( id, isover ) {
    
        var arr = id.split( 'x' );
        var x = arr[ 0 ];
        var y = arr[ 1 ];
        
        if( isover ) {
        
            var classnm = 'rowhighlight';

        }
        else {
        
            var classnm = 'row';
        
        }
        
        for( var counter = 1; counter <= tablewidth; counter ++ ) {
        
            ********.getElementById( x + 'x' + counter ).className = classnm;
        
        }
        
        for( var counter = 1; counter <= tableheight; counter ++ ) {
        
            ********.getElementById( counter + 'x' + y ).className = classnm;
        
        }
    
    }

</script>
<table>
    <tr>
        <td onmouseover="cellevent( this.id, true );" onmouseout="cellevent( this.id, false );" class="row" id="1x1">1</td>
        <td onmouseover="cellevent( this.id, true );" onmouseout="cellevent( this.id, false );" class="row" id="1x2">2</td>
        <td onmouseover="cellevent( this.id, true );" onmouseout="cellevent( this.id, false );" class="row" id="1x3">3</td>
        <td onmouseover="cellevent( this.id, true );" onmouseout="cellevent( this.id, false );" class="row" id="1x4">4</td>
    </tr>
    <tr>
        <td onmouseover="cellevent( this.id, true );" onmouseout="cellevent( this.id, false );" class="row" id="2x1">5</td>
        <td onmouseover="cellevent( this.id, true );" onmouseout="cellevent( this.id, false );" class="row" id="2x2">6</td>
        <td onmouseover="cellevent( this.id, true );" onmouseout="cellevent( this.id, false );" class="row" id="2x3">7</td>
        <td onmouseover="cellevent( this.id, true );" onmouseout="cellevent( this.id, false );" class="row" id="2x4">8</td>
    </tr>
    <tr>
        <td onmouseover="cellevent( this.id, true );" onmouseout="cellevent( this.id, false );" class="row" id="3x1">9</td>
        <td onmouseover="cellevent( this.id, true );" onmouseout="cellevent( this.id, false );" class="row" id="3x2">10</td>
        <td onmouseover="cellevent( this.id, true );" onmouseout="cellevent( this.id, false );" class="row" id="3x3">11</td>
        <td onmouseover="cellevent( this.id, true );" onmouseout="cellevent( this.id, false );" class="row" id="3x4">12</td>
    </tr>
    <tr>
        <td onmouseover="cellevent( this.id, true );" onmouseout="cellevent( this.id, false );" class="row" id="4x1">13</td>
        <td onmouseover="cellevent( this.id, true );" onmouseout="cellevent( this.id, false );" class="row" id="4x2">14</td>
        <td onmouseover="cellevent( this.id, true );" onmouseout="cellevent( this.id, false );" class="row" id="4x3">15</td>
        <td onmouseover="cellevent( this.id, true );" onmouseout="cellevent( this.id, false );" class="row" id="4x4">16</td>
    </tr>
</table>
 
Üst Alt