Creating a function to change Link style with setInterval

programming web dev
1

Hello all,

I am relatively new to HTML/CSS and am hoping someone can help me. Here is the page i am working on…

http://www.murphyjahn.com/html/INDEX_061512.html

On this page, you can see that every 6 seconds, the background image changes. Background image 1 corresponds to the 1st link. Background image 2 corresponds to the 2nd link, and so on and so on. I want to write a function that changes each link’s text style in sequence so that when image 1 is displaying, link 1 is highlighted. When the background image changes to image 2, link 1 returns to normal and link 2 is highlighted. Any direction on how to execute this would be really helpful.

Here is the function that changes the images.

<script language="JavaScript1.2">
    var bgimages=new Array()
    bgimages[0]="IMAGES/UPDATES/1-BW.jpg"
    bgimages[1]="IMAGES/UPDATES/2-BW.jpg"
    bgimages[2]="IMAGES/UPDATES/3-BW.jpg"
    bgimages[3]="IMAGES/UPDATES/4-BW.jpg"
    bgimages[4]="IMAGES/UPDATES/5-BW.jpg"


    var inc=-1
    
    function bgSlide()
    {
      if (inc<bgimages.length-1)
        inc++
      else
        inc=0
      document.body.style.backgroundImage="url('"+bgimages[inc]+"')"
    }
    
    if (document.all||document.getElementById)
      window.onload=new Function('setInterval("bgSlide()",6000)')
</script>

and here is a typical link

 <div><a href="PROJECTS/YIBD.html"><b><i>IMAGE UPDATE</i></b> -- PENTOMINIUM TOWERS: SEOUL SOUTH KOREA</a></div>

and here is the CSS within the page for link styles…

a:link {
    color:#999999;
    text-decoration:none;
}
a:visited {
    color:#666666;
    text-decoration:line-through;
}
a:active {
    color:#FFFFFF;
    text-decoration: line-through;
}
a:hover {
    color:#FFFFFF;
    text-decoration: line-through;
}

I think the function im looking for will be pretty similar to the bgSLide function above, but i am having trouble understanding how to define each link with an ID, get those ID’s into an array and then cycle through those array changing the CSS styles as i go.

Thanks for any and all help!!!