Member Avatar for ItecKid

Hello,

I am attempting to use JavaScript to 'highlight' text by changing it's background color:

<div id="foo" onMouseOver="highlight(this);"></div>

In JavaScript:

function highlight (word) {
document.getElementById (word.id).bgColor="blue";
}

This produces no effect. I also have an onClick event in the same div, can I not have onClick and onMouseOver together? Or am I doing something else wrong?

Thanks.

  • 3 Contributors
  • 3 Replies
  • 2K Views
  • 7 Hours Discussion Span
  • Latest Post Latest Post by ItecKid

Recommended Answers

All 3 Replies

Member Avatar for harry010

This might not be what you want, but can't you use the :hover pseudo class on a div to set the background color?

Member Avatar for almostbob 
function highlight(word) {document.getElementById (word).bgColor="blue";}

you will also require another javascript and an onmouseout() to reset the background or in short order everything will be blue
css is smaller faster and works when javascript is disabled for security reasons

.hl {background:#ffffff; }
.hl:hover { background:#0000ff; }
<span> this does not highlight on mouseover</span>
<span class='hl'> this does highlight on mouseover</span>
Edited by almostbob because: n/a
Member Avatar for ItecKid

Thanks for the help guys, much easier than what I was trying to do. :) Marking solved.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.