Highlight Link

Johnathan · **Posted:** Sun Jun 01, 2008 11:54 pm

Don't really know what to google for. But I want to know how to do that think when you hover over a link the whole thing highlights... Like this http://boagworld.com/ .

dflynn · **Posted:** Mon Jun 02, 2008 2:15 am

Something like this:

onrollover yadayadayada style="background-color: #FFFF66"

rangana · **Posted:** Mon Jun 02, 2008 2:59 am

Have you tried something along the lines of:

Code:

Johnathan · **Posted:** Mon Jun 02, 2008 8:31 am

dflynn wrote:

Something like this:

onrollover yadayadayada style="background-color: #FFFF66"

Thank You dflynn.

Quote:

Code:

Would I not need to insert that for every link?

rangana · **Posted:** Mon Jun 02, 2008 8:50 am

Yes, it should be, but this can also be done with a for loop, to access every link.

This should work:

Code:

<script type="text/javascript">
window.onload=function()
{
   var rangAs=document.getElementsByTagName('a');
   for(var rangLoop=0;rangLoop<rangAs.length;rangLoop++)
   {
   rangAs[rangLoop].onmouseover=function()
      {
      this.style.background='#0f0'; //background when hovered
      }
   rangAs[rangLoop].onmouseout=function()
      {
      this.style.background='#fff'; //Background when not on hover
      }
   }
}
</script>
<a href="#">Link</a>
<a href="#">Link</a>
<a href="#">Link</a>
<a href="#">Link</a>
<a href="#">Link</a>
<a href="#">Link</a>

See if it helps

Johnathan · **Posted:** Mon Jun 02, 2008 8:53 am

But will that not make the links always highlighted and only a different colour on rollover?

rangana · **Posted:** Mon Jun 02, 2008 9:02 am

What do you mean?

The codes i've given highlights the background when you hovered over it, and returns to its original background.

See coments from the code,..or i'm missing something.

Johnathan · **Posted:** Mon Jun 02, 2008 2:11 pm

It's ok I think I understand it now

, I was in a rush this morning.

rangana · **Posted:** Tue Jun 03, 2008 1:13 am

No worries, glad to help

Highlight Link

Who is online