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 2 of 2
  1. #1
    New to the CF scene
    Join Date
    May 2005
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    How to pass style sheet property in onmouseover

    Hi there

    Can any body know how to pass style sheet property in onmouseover function.

    I have a form where i am displaying some rows retrieving from database.onmouseover the color of the row should change. I have already done that one by passing the color explicitly

    for example

    <tr onMouseOver="setPointer (this,rowNo, 'over',#FFFFFF,#222222, '#DEEFFF');" onMouseOut="setPointer (this,rowNo, 'out',#FFFFFF,#222222, '#DEEFFF');">

    and setPointer function is as below

    if ( (theAction=='over') && (theRowNo%2==0) )
    element.style.backgroundColor=thePointerColor;
    if ( (theAction=='over') && (theRowNo%2!=0) )
    element.style.backgroundColor=thePointerColor;
    if ( (theAction=='out') && (theRowNo%2==0) )
    element.style.backgroundColor=theFirstDefaultColor;
    if ( (theAction=='out') && (theRowNo%2!=0) )
    element.style.backgroundColor=theSecondDefaultColor;

    }


    if i suppose my client wants to change the color of the row onmouseover i have to change the code explictly. but if suppose i declare a style sheet suppose

    .first
    {
    background-color:#FFFFFF;
    }

    and instead of #FFFFFF in setPointer function i want to pass this style sheet how is it possible

    i have written this but nothing works

    <tr onMouseOver="setPointer (this,rowNo, 'over',this.className='first',#222222, '#DEEFFF');" onMouseOut="setPointer (this,rowNo, 'out',this.className='first',#222222, '#DEEFFF');">


    and setPointer function is as below

    if ( (theAction=='over') && (theRowNo%2==0) )
    element.style.backgroundColor=thePointerColor;
    if ( (theAction=='over') && (theRowNo%2!=0) )
    element.style.backgroundColor=thePointerColor;
    if ( (theAction=='out') && (theRowNo%2==0) )
    element.style.backgroundColor=document.getElementById('theFirstDefaultColor').style.background-color;
    if ( (theAction=='out') && (theRowNo%2!=0) )
    element.style.backgroundColor=theSecondDefaultColor;

    }


    can anybody please help me

    thanks in advance
    kumar

  • #2
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,466
    Thanks
    3
    Thanked 495 Times in 482 Posts
    Afraid you lost me but this may give you some ideas

    PHP Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd"
    >

    <
    html>

    <
    head>
      <
    title></title>
    <
    script language="JavaScript" type="text/javascript">
    <!--

    function 
    TDColors(){
     
    trs=document.getElementsByTagName('TR')
     for (
    i=0;i<trs.length;i++){
      
    trs[i].style.backgroundColor='red'
      
    trs[i].out='red';
      
    trs[i].over='blue';
      
    trs[i].onmouseover=function(){ this.style.backgroundColor=this.over; }
      
    trs[i].onmouseout=function(){ this.style.backgroundColor=this.out; }
     }


    }
    //-->
    </script>
    </head>

    <body onload="TDColors();" >
    <table width="200" border="1">
      <tr>
        <td >.</td>
      </tr>
      <tr>
        <td >.</td>
      </tr>
    </table>
    </body>

    </html> 


  •  

    Posting Permissions

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