Partyflock
 
Forumonderwerp · 810122
­ 🇳🇱 Waarschuw beheerder

JavaScript request

77x bekeken
Waarschuw beheerder
eyz.
ik heb een menu dat uit plaatjes bestaat. Elk plaatje heeft een rollover ( bijna zelfde plaatje alleen dan iets ander kleurtje ofzo )
Nu wil ik dat als je op een knop klik, dat die rollover image zichtbaar blijft. En zodra je op een andere knop klik, moet de rollover daar vanaf gaan en op de laatst geklikte knop komen.
Heeft iemand zo'n scriptje?

ps: Het menu word niet steeds opnieuw geladen als je naar een andere pagina ga.

greetz
Waarschuw beheerder
donateur
Als je nu bij de onClick een resetfunctie aanroept die je zelf schrijft en de originele plaatjes weer erin zet is je probleem opgelost :)
Waarschuw beheerder
Gewoon bij onclick het betreffende plaatje wijzigen en alle andere terugzetten. Hiervoor kun je het beste DOM gebruiken, maar je zou het ook kunnen hardcoden.

Edit:

Een voorbeeld van hoe je DOM kunt gebruiken om iets dergelijks te maken:



<?xml version="1.0"?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>

<title>DOM isn't dumb</title>

<style type="text/css">

li {

cursor: pointer;

}

</style>

<script type="text/javascript">

var MENU_ID_PREFIX = "menuitem";



function selectItem(menuID) {

// loop through nodes by adding an integer

for(var i = 1; menuitemNode = document.getElementById(MENU_ID_PREFIX + i); i++) {

if(i == menuID) {

menuitemNode.style.background = "#FF0000";

} else {

menuitemNode.style.background = "#FFFFFF";

}

}

}

</script>

</head>

<body>

<ul>

<li id="menuitem1" onclick="javascript:selectItem(1);">Foo</li>

<li id="menuitem2" onclick="javascript:selectItem(2);">Bar</li>

<li id="menuitem3" onclick="javascript:selectItem(3);">Baz</li>

</ul>

</body>

</html>



PS: Uiteraard kun je het op veel meer manieren doen, waarsch. ook nog wel wat handiger dan dit. Het voordeel aan deze methode is dat hij volgens de standaarden is (XHTML 1.0) en op zowel IE als Mozilla/Firefox werkt.
laatste aanpassing
Waarschuw beheerder
thnx man.
zal morgen eens ff checken, nu te laat :D