SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    <?php echo"GiroPets"; ?> giropets's Avatar
    Join Date
    Jul 2003
    Location
    United States
    Posts
    242
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Need help with Checkbox changing <tr> bg color...

    Hi everyone,

    I thought that it would be cool if I added a feature on my site where if you click a checkbox in the Private Messenging that it would change the background color of the message title to a different color. But if you uncheck the box, it changes it back to the original color.

    But, I tried searching Google for examples of this but I found none. All that I found was onMouseOver and onMouseOut effects, but that's not what I want. Here's my HTML code and I hope someone could help me. I bet it's something really simple, though I don't know very much about JavaScript.

    I'd really appreciate it if this is solved.

    HTML Code:
    <html>
    <head>
    	<title>Checkboxes</title>
    
    	<script language='JavaScript' type='text/javascript'>
    		<!--
    
    			function highlight(id){
    
    				if(document.getElementById(id).style.background == "#FFFFCC"){
    					document.getElementById(id).style.background = "#FFFFFF";
    				}
    				elseif(document.getElementById(id).style.background == "#FFFFFF"){
    					document.getElementById(id).style.background = "#FFFFCC";
    				}
    				else{
    					document.getElementById(id).style.background = "#FFFFFF";
    				}
    
    			}
    		//-->
    	</script>
    
    </head>
    <body>
    
    	<table border="1">
    
    		<tr id="chk1" style="background: #FFFFCC;">
    			<td>
    				<input type="Checkbox" onClick="javascript:highlight('chk1');">
    			</td>
    			<td>
    				afafgaf
    			</td>
    		</tr>
    
    	</table>
    
    
    </body>
    </html>
    Thanks.

    Best Regards,
    - Mike S.
    GiroPets.net.

  2. #2
    SitePoint Member
    Join Date
    Jun 2004
    Location
    Dunedin
    Posts
    17
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    hi there i tried your code and it seems fine but i just changed a little for the colour code you used:
    <html>
    <head>
    <title>Checkboxes</title>

    <script language='JavaScript' type='text/javascript'>
    <!--

    function highlight(id){
    //alert(document.getElementById(id).style.background);

    if(document.getElementById(id).style.background == "#ffffcc"){
    document.getElementById(id).style.background = "#ffffff";
    }
    else if(document.getElementById(id).style.background == "#ffffff"){
    //alert("1");
    document.getElementById(id).style.background = "#ffffcc";
    }
    else{
    document.getElementById(id).style.background = "#ffffff";
    }

    }
    //-->
    </script>

    </head>
    <body>

    <table border="1">

    <tr id="chk1" style="background: #FFFFCC;">
    <td>
    <input type="Checkbox" onmousedown="highlight('chk1');">
    </td>
    <td>
    afafgaf
    </td>
    </tr>

    </table>


    </body>
    </html>

    hope this helps

  3. #3
    <?php echo"GiroPets"; ?> giropets's Avatar
    Join Date
    Jul 2003
    Location
    United States
    Posts
    242
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Wow, thanks, that goes to show you how little JavaScript I know... :P


Bookmarks

Posting Permissions

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