Hi all, I am developing this website http://alturl.com/oy8m if you roolover the left menus the images will change but what I want to do is the images will change every 4 seconds and the menus will get highlighted automaticaly instead of manually roolvering the menus for image changes can some1 help me on this thank you
if u want java script code u go to google and search it dynamic drive all coded it a viable in this site
thanks ! that is a great site and one of my favourits! but I can not find the javascript effect that I am looking for
Try this sample code, i think it helps you: <head> <style> .normalMenu { background-color: #DFEDBD; padding-left: 0px; } .activeMenu { background-color: #DFEDBD; padding-left: 30px; } </style> <script> var highlightedIdx = -1; function IterateHighlighted () { var ul = document.getElementById ("main_links_list"); var lis = ul.getElementsByTagName ("li"); if (highlightedIdx >= 0) { lis[highlightedIdx].className = "normalMenu" } highlightedIdx++; if (highlightedIdx >= lis.length) { highlightedIdx %= lis.length; } var highlightedLI = lis[highlightedIdx]; var imageURL = highlightedLI.getAttribute ("image"); var homepage_page_image = document.getElementById ("homepage_page_image"); homepage_page_image.src = imageURL; highlightedLI.className = "activeMenu"; } function Init () { IterateHighlighted (); window.setInterval (IterateHighlighted, 1000); } </script> </head> <body onload="Init ()"> <ul id="main_links_list"> <li class="normalMenu" image="http://lchrmeducation.org.uk/images/home_page_header.jpg"><a href="http://lchrmeducation.org.uk" title="LCHRM Education Page">home</a></li> <li class="normalMenu" image="http://lchrmeducation.org.uk/images/about_us_page_header.jpg"><a href="about_us/about_us.html" title="LCHRM Education About Us">about us</a></li> <li class="normalMenu" image="http://lchrmeducation.org.uk/images/accreditations_page_header.jpg"><a href="accreditations.html" title="LCHRM Education Accreditations">accreditations</a></li> <li class="normalMenu" image="http://lchrmeducation.org.uk/images/courses_page_header.jpg"><a href="courses.html" title="LCHRM Education Courses">courses</a></li> <li class="normalMenu" image="http://lchrmeducation.org.uk/images/admissions_page_header.jpg"><a href="admissions/admissions.html" title="LCHRM Education Admissions">admissions</a></li> <li class="normalMenu" image="http://lchrmeducation.org.uk/images/facilities_page_header.jpg"><a href="facilities.html" title="LCHRM Education Facilities">facilities</a></li> <li class="normalMenu" image="http://lchrmeducation.org.uk/images/life_in_london_page_header.jpg"><a href="life_in_london.html" title="LCHRM Education Life In London">life in london</a></li> <li class="normalMenu" image="http://lchrmeducation.org.uk/images/staff_page_header.jpg"><a href="staff.html" title="LCHRM Education Staff">staff</a></li> <li class="normalMenu" image="http://lchrmeducation.org.uk/images/jobs_page_header.jpg"><a href="jobs.html" title="LCHRM Education Jobs">jobs</a></li> <li class="normalMenu" image="http://lchrmeducation.org.uk/images/contact_us_page_header.jpg"><a href="contact_us/contact_us.html" title="LCHRM Education Contact Us">contact us</a></li> </ul> <img src="http://lchrmeducation.org.uk/images/images/home_page_header.jpg" id="homepage_page_image" width="551" height="327" alt="LCHRM Education" title="LCHRM Education" /> </body> Code (markup):
hi, sorry for replying so late, I was on a break and arrive yesterday... thanks fore the code, I will jump into that in few days thank you