Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    Regular Coder
    Join Date
    Aug 2005
    Posts
    257
    Thanks
    8
    Thanked 0 Times in 0 Posts

    forcing change bgcolor

    I have two classes in CSS called "read" and another called " not read " what I want to do is that when the class applies "read" in a cell JAVASCRIPT force a change to the white color in the totality of the cell(bgcolor) and if I apply the class " not read " change to blue color. Regards

  • #2
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    Which event should call the javascript functions? onclick? onmouseover? make it a little more precise for us, please.
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #3
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,529
    Thanks
    3
    Thanked 511 Times in 498 Posts
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    
    <html>
    
    <head>
      <title></title>
    <script language="JavaScript" type="text/javascript">
    <!--
    // will work for any elements in the table with background-color inline style using onmouseover or onclick
    
    function CngBGColor(zxcobj,col){
     var zxctable=zxcobj;
     while (zxctable.parentNode){
      if (zxctable.tagName=='TABLE'){ break; }
      zxctable=zxctable.parentNode;
     }
     if (!window['zxc'+zxctable.id]){
      window['zxc'+zxctable.id]=[];
      var zxcels=zxctable.getElementsByTagName('*')||zxctable.all;
      for (var zxc0=0;zxc0<zxcels.length;zxc0++){
       if (zxcels[zxc0].style.backgroundColor){ window['zxc'+zxctable.id].push([zxcels[zxc0],zxcels[zxc0].style.backgroundColor]); }
      }
     }
     var zxcary=window['zxc'+zxctable.id];
     var zxcel=1;
     for (var zxc1=0;zxc1<zxcary.length;zxc1++){
      if (zxcary[zxc1][0]!=zxcobj){ zxcary[zxc1][0].style.backgroundColor=zxcary[zxc1][1]; }
      else { zxcel=zxc1; }
     }
     zxcobj.style.backgroundColor=(zxcobj.style.backgroundColor==zxcary[zxcel][1])?col:zxcary[zxcel][1];
    }
    
    
    
    
    //-->
    </script>
    </head>
    
    <body >
    
    
    
    <table width="100" id="ted" cellpadding="0" cellspacing="0" border="1">
      <tr style="background-color:red;" onclick="CngBGColor(this,'blue');" >
        <td width="100">1111</td>
      </tr>
      <tr style="background-color:red;" onmouseover="CngBGColor(this,'green');" >
        <td width="100">1111</td>
      </tr>
    </table>
    
    </body>
    
    </html>
    or

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    
    <html>
    <head>
    <script language="javascript" type="text/javascript">
    
    
    function CngCol(obj,col,grp) {
     if (window[grp]){window[grp][0].bgColor=window[grp][1]; }
     if (!window[grp]){window[grp]=null; }
     window[grp]=[obj,obj.bgColor];
     obj.bgColor=col;
    }
    
    </script>
    </head>
    <body>
    <table width=100 border=1 >
     <tr bgcolor="red" onClick="CngCol(this,'blue','grp1')" >
      <td>
       Message number 1
      </td>
    <tr>
     <tr>
      <td onClick="CngCol(this,'green','grp1')" >
       Message number 1
      </td>
    <tr>
     <tr>
      <td onClick="CngCol(this,'yellow','grp1')" >
       Message number 1
      </td>
    <tr>
    </table>
    </body>
    </html>
    Last edited by vwphillips; 08-11-2006 at 05:14 PM.
    Vic

    God Loves You and will never love you less.

    http://www.vicsjavascripts.org/Home.htm

    If my post has been useful please donate to http://www.operationsmile.org.uk/


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •