Improve company productivity with a Business Account.Sign Up

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 231
  • Last Modified:

onmouseover cell color

I am trying to find out why my cell color will not change?

I put in the following:
<a target="I1" href="inc_opportunities_open_intel.aspx"><td class="style7" onMouseover="this.bgColor='lightblue';" onMouseout="this.bgColor='';" style="width: 75px">open</td></a>
0
Matt Pinkston
Asked:
Matt Pinkston
  • 4
  • 3
  • 2
  • +2
1 Solution
 
Dan CraciunIT ConsultantCommented:
quote problems?
<a target="I1" href="inc_opportunities_open_intel.aspx">
<td class="style7" onMouseover="this.bgColor='lightblue'" onMouseout="this.bgColor='white'" style="width: 75px;">open</td>
</a>

Open in new window


HTH,
Dan
0
 
Matt PinkstonAuthor Commented:
No error but no change in colors

<a target="I1" href="inc_opportunities_open_intel.aspx"><td class="style7" onMouseover="this.bgColor='lightblue'" onMouseout="this.bgColor='white'" style="width: 75px">open</td></a>
0
 
Dan CraciunIT ConsultantCommented:
I think you need to use hex values. Tested this and it works:
<TR onMouseover="this.bgColor='#99AACC'" onMouseout="this.bgColor='#FFFFFF'">
0
Easily Design & Build Your Next Website

Squarespace’s all-in-one platform gives you everything you need to express yourself creatively online, whether it is with a domain, website, or online store. Get started with your free trial today, and when ready, take 10% off your first purchase with offer code 'EXPERTS'.

 
Matt PinkstonAuthor Commented:
no change
<a target="I1" href="inc_opportunities_open_intel.aspx"><td class="style7" onMouseover="this.bgColor='#99AACC'" onMouseout="this.bgColor='#FFFFFF'" style="width: 75px">open</td></a>
0
 
Julian HansenCommented:
I see  a couple of problems.

Wrapping a <td> in an <a> element is not a good idea. Rather put your <a> inside the <td> make it a block element and the height and width you want and then use CSS :hover to change the cell.
a {
	width: 75px;
}
a:hover {
	background: lightblue;
}

Open in new window

HTML
<table>
  <tr>
    <td>
      <a href="">one</a>
    </td>
    ...
  </tr>
  ...

Open in new window

0
 
Dan CraciunIT ConsultantCommented:
++ on Julian's solution. It's the way it's been done for the past 7 years or so.

But, if you're stuck on archaic systems behind corporate rules, you might need to do it old style.
If you can tell us the browser you're using to test your code, we could be of more assistance.

Dan
0
 
Matt PinkstonAuthor Commented:
Browser is IE11

On the second option you have to mouse over the word to click it, I want users to be able to click the box instead which is why we went the other route.
0
 
Julian HansenCommented:
On the second option you have to mouse over the word to click it, I want users to be able to click the box instead which is why we went the other route.
That's why you make your <a> a block element so it fills the cell - that way you get the same effect without having to use bad markup and javascript to do what should be done through CSS
0
 
GaryCommented:
Your original code works fine. The only way to break it is if the TD is not part of a table...
http://jsfiddle.net/GaryC123/5L5Pw/

Tho everything Julian says still holds true.
0
 
Kim WalkerWeb Programmer/TechnicianCommented:
What's the doctype? bgcolor is not supported in HTML5 although I'd be surprised if IE11 didn't support it anyway.
0
 
Matt PinkstonAuthor Commented:
excellent thanks
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Free Tool: Port Scanner

Check which ports are open to the outside world. Helps make sure that your firewall rules are working as intended.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

  • 4
  • 3
  • 2
  • +2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now