www.webdeveloper.com
Results 1 to 5 of 5

Thread: bgColor="#FFFFFF" in SetTimeout throws Illegal Char error

Hybrid View

  1. #1
    Join Date
    Dec 2009
    Location
    Aberdeen
    Posts
    2

    Question bgColor="#FFFFFF" in SetTimeout throws Illegal Char error

    The following code is meant to change cell colour to black on mouse over and set it to white 3 seconds after mouse out.

    HTML Code:
    <td onmouseover='this.bgColor="#000000"' onmouseout='setTimeout(this.bgColor=,3000)'>&nbsp;</td>
    but instead just throws an Illegal Character Error.

    Have tried some variations like the foll, but they either just throw the same error or neither error nor result!

    HTML Code:
    <td ... onmouseout='var color="#FFFFFF";setTimeout(this.bgColor=color,3000)'>...</td>
    Could someone point out where I'm going wrong?

    Thanks

  2. #2
    Join Date
    Dec 2003
    Location
    Bucharest, ROMANIA
    Posts
    15,428
    better use a function, placed in the HEAD. And CSS properties:
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <title>Untitled Document</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta http-equiv="Content-Style-Type" content="text/css">
    <meta http-equiv="Content-Script-Type" content="text/javascript">
    <script type="text/javascript">
    function changeBG(tr,color){
    tr.style.backgroundColor=color;
    }
    </script>
    </head>
    <body>
    <table width="100" border="1">
    <tr><td onmouseover="changeBG(this,'#000')" onmouseout="changeBG(this,'#fff')">z</td></tr>
    <tr><td onmouseover="changeBG(this,'#000')" onmouseout="changeBG(this,'#fff')">z</td></tr>
    </table>
    </body>
    </html>
    but even better you can attach the events dynamically.
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <title>Untitled Document</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta http-equiv="Content-Style-Type" content="text/css">
    <meta http-equiv="Content-Script-Type" content="text/javascript">
    <script type="text/javascript">
    onload=function(){
    var oncolor="#000";
    var offcolor="#fff";
    var allTD=document.getElementById('mytab').getElementsByTagName('td'), td, i=0;
    while(td=allTD[i++]){
    td.onmouseover=function(){this.style.backgroundColor=oncolor}
    td.onmouseout=function(){this.style.backgroundColor=offcolor}
    }
    }
    </script>
    </head>
    <body>
    <table width="100" border="1" id="mytab">
    <tr><td>z</td></tr>
    <tr><td>y</td></tr>
    </table>
    </body>
    </html>
    Last edited by Kor; 12-15-2009 at 08:14 AM.

  3. #3
    Join Date
    Dec 2009
    Location
    Aberdeen
    Posts
    2
    Based on your first solution:
    PHP Code:
    <script type="text/javascript">
    <!--
    function 
    changeBG000(td)
    {
        
    td.style.backgroundColor="#000000";
    }
    function 
    changeBGFFF(td)
    {
        
    td.style.backgroundColor="#FFFFFF";
    }
    //-->
    </script> 
    and in the body:
    HTML Code:
    <td style="background-color:#FFFFFF;" 
      onmouseover='changeBG000(this)' 
      onmouseout="setTimeout('changeBGFFF(this)',1000)">
    &nbsp;</td>
    Result is that the cell turns black on mouse over (expected!) but fails to turn back white after timeout and throws the error:
    Error: td.style is undefined

  4. #4
    Join Date
    Dec 2003
    Location
    Bucharest, ROMANIA
    Posts
    15,428
    Quote Originally Posted by bPratik View Post
    Based on your first solution:
    No, not really. Anyway what about?:
    Code:
    onmouseout="setTimeout(function(){changeBGFFF(this)},1000)"

  5. #5
    Join Date
    Jul 2008
    Location
    urbana, il
    Posts
    2,787
    Quote Originally Posted by bPratik View Post
    The following code is meant to change cell colour to black on mouse over and set it to white 3 seconds after mouse out.


    Code:
    <td onmouseover='this.bgColor="#000000"' onmouseout='setTimeout(this.bgColor=,3000)'>&nbsp;</td>

    but instead just throws an Illegal Character Error.


    Could someone point out where I'm going wrong?

    Thanks
    this.bgColor= WHAT?

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

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



Recent Articles