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 9 of 9
  1. #1
    Regular Coder
    Join Date
    May 2005
    Posts
    190
    Thanks
    1
    Thanked 2 Times in 2 Posts

    how to change a table row bg, without any js in the table?

    like onmouseover or onmouseout calling a function. we're not allowed toput any js in the page because it interferes with those reading aides or something.

    i tried adding an eventListener, of course it worked perfectly in firefox, but ie doesnt support that.

    any ideas? this is driving me crazy. thanks

  • #2
    Regular Coder
    Join Date
    May 2005
    Location
    Michigan, USA
    Posts
    566
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Whats wrong with running some JS after the table is created and setting each box to have its proper onmouseover, onmouseout events!
    Note: I do not test code. I just write it off the top of my head. There might be bugs in it! But if any thing I gave you the overall theory of what you need to accomplish. Also there are plenty of other ways to accomplish this same thing. I just gave one example of it. Other ways might be faster and more efficient.

  • #3
    Regular Coder
    Join Date
    May 2005
    Posts
    190
    Thanks
    1
    Thanked 2 Times in 2 Posts
    something to do with 508 standards

  • #4
    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
    You may attach dinamically the events onload using DOM1 level methods. Put this code in HEAD. make sure you have no other onload whithin the page. Chose your own collors for rollover...
    PHP Code:
    <script type="text/javascript">
    var 
    coloff='#ffffff';//roll off color
    var colon='#e5e5e5';//roll on collor
    onload=function(){
    var 
    allCells document.getElementById('mytable').getElementsByTagName('td');
    for(var 
    i=0;i<allCells.length;i++){
    allCells[i].onmouseover=function(){
    this.style.background=colon;
    }
    allCells[i].onmouseout=function(){
    this.style.background=coloff;
    }
    }
    }
    </script> 
    If you can not modify the content (to give table an id) you may use the index of the table (count the index of your table from top to bottom)

    var allCells = document.getElementsByTagName('table')[0].getElementsByTagName('td');
    if it is first
    var allCells = document.getElementsByTagName('table')[1].getElementsByTagName('td');
    if second.... and so on
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #5
    Regular Coder
    Join Date
    May 2005
    Posts
    190
    Thanks
    1
    Thanked 2 Times in 2 Posts
    wow thats just like the litener that i set up, ill try it out and let you know. thanks

  • #6
    Regular Coder
    Join Date
    May 2005
    Posts
    190
    Thanks
    1
    Thanked 2 Times in 2 Posts
    thank you that worked great!!!! this should be a stickey somewhere. i just modified the code to ignore the title row, change the className isnted of the bg and change the whole row's class.

    thanks again

  • #7
    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
    Quote Originally Posted by emehrkay
    thank you that worked great!!!! this should be a stickey somewhere. i just modified the code to ignore the title row, change the className isnted of the bg and change the whole row's class.

    thanks again
    You should have something like:
    PHP Code:
    <script type="text/javascript">
    var 
    coff='classoff';//roll off classname
    var con='classon';//roll on classname
    onload=function(){
    var 
    aRow document.getElementById('mytable').getElementsByTagName('tr');
    for(var 
    i=0;i<aRow.length;i++){
    aRow[i].onmouseover=function(){
    this.className=con;
    }
    aRow[i].onmouseout=function(){
    this.className=coff;
    }
    }
    }
    </script> 
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #8
    Regular Coder
    Join Date
    May 2005
    Posts
    190
    Thanks
    1
    Thanked 2 Times in 2 Posts
    cool thanks a lot, thats what i did. could i add more functions to the onload event?

  • #9
    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
    You may add as many functions as you want
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*


  •  

    Posting Permissions

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