Jump to content

onMouseOver-commands in CSS?


knuhe

Recommended Posts

Hello, I'm new to CSS, and also new on this community.

I'm trying to figure out how to place a onMouseOver command into one of my stylesheets.
In this example I want my table column to change color when i move my mouse over it.

This is the code I've made so far:

[code]
.menytabell {
       width: 149px;
       height: 14px;
       background-color: #EEEEEE;
}
[/code]

Now here comes my problems... I that code to match this equivalent, so I can save space and make my menu editings go faster:

[code]<td width=149 height="14" style="background-color:#EEEEEE" onMouseOver="this.style.backgroundColor='#FFFFF0'" onMouseOut="this.style.backgroundColor='#EEEEEE'">
[/code]

Can any of you help me out?

Cheers
Link to comment
Share on other sites

[code].menytabell {
       width: 149px;
       height: 14px;
       background-color: #EEEEEE;
}

.menytabell:hover {
       background-color: #FFFFF0;
}[/code]

the :hover pseudo class gets activated when you mouseover, and deactivated when you mouseout.
Link to comment
Share on other sites

Thanks, I tried your solution, and it ought to work, but sadly it won't:(
It sees like it sticks with the

[code].menytabell {
       width: 149px;
       height: 14px;
       background-color: #EEEEEE;
}[/code]

and not changing the color when i move my cursor over the table element.

Do you know whats going on?
Link to comment
Share on other sites

[!--quoteo(post=372055:date=May 7 2006, 06:50 PM:name=wildteen88)--][div class=\'quotetop\']QUOTE(wildteen88 @ May 7 2006, 06:50 PM) [snapback]372055[/snapback][/div][div class=\'quotemain\'][!--quotec--]
Yes use the :hover persuado class.

NOTE: currently IE6 doesn't support the :hover persuado class on any tag accept the anchor (a) tag, but IE7 now supports the :hover persuado class on any tag.
[/quote]

Do you know is this altso applies to Firefox? I'm using version 1.5.0.3.
Link to comment
Share on other sites

Strange...

Have tried a few things, but it don't seem to work right.

Maybe it's my code in the HTML-file that's wrong?
Is this the right way to do it when I want a row in my table to change color when pointing at it?

[code]
<table>
<tr onclick=view('./index.html') height="14">
    <td class="menytabell">
          <div class="meny">Hovedsiden</div>
    </td>
<tr>
</table>
[/code]
Link to comment
Share on other sites

  • 3 weeks later...
Just remove the background-color from the class in you style sheet.

If that doesn't work, just make another class with the different background color and use the this.className='whatever' on the mouse event.
Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.