Niet werkend script

Status
Niet open voor verdere reacties.
D

dafje95

Gebruiker
Lid geworden
5 dec 2008
Berichten
103
Hallo,

Ik ben redelijk onervaren met JS, maar dat zullen jullie denk ik ook wel zien aan mijn code.
Wat ik probeer te bereiken: Als je op knop 1 klinkt moeten er stijlelementen in css veranderen binnen een div met ID "Page1" en zo verder ook met de knoppen 2, 3 en 4.
Kan iemand mij vertellen wat er verkeerd is aan dit script:
Code: 
<script>


function show(elementID) {
	var p2 = document.getElementById("Page2");
	var p3 = document.getElementById("Page3");
	var p4 = document.getElementById("Page4");
	
    if (elementID = 'Page1') {
        p2.style.opacity = 0;
	p3.style.left = "100%";
	p4.style.top = "100%";
	}
    else if (elementID = 'Page2') {
        p2.style.opacity = 1;
	p3.style.left = "100%";
	p4.style.top = "100%";
	}
    else if (elementID = 'Page3') {
        p2.style.opacity = 0;
	p3.style.left = "100px";
	p4.style.top = "100%";
	}
    else if (elementID = 'Page4') {
        p2.style.opacity = 0;
	p3.style.left = "100%";
	p4.style.top = "0px";
	}
}
</script>

Code: 
<a href="#" onclick="show('Page1');">Knop1</a>
<a href="#" onclick="show('Page2');">Knop2</a>
<a href="#" onclick="show('Page3');">Knop3</a>
<a href="#" onclick="show('Page4');">Knop4</a>

Code: 
<div class="PageWrapper">
<div class="page" id="Page1">
<p>Page1</p>
</div>

<div class="page" id="Page2">
<p>Page2</p>
</div>

<div class="page" id="Page3" >
<p>Page3</p>
</div>

<div class="page" id="Page4" >
<p>Page4</p>
</div>
</div>
 
Laatst bewerkt:
Misschien kan je hier op verder bouwen.

Grtz,
MDN111

Code: 
<!DOCTYPE html>
<head>
<script>

function show(elementID) {
              var p1 = document.getElementById('Page1');
	var p2 = document.getElementById('Page2');
	var p3 = document.getElementById('Page3');
	var p4 = document.getElementById('Page4');
	
    if (elementID == 'Page1') {
              p1.style.opacity = 1;
              p2.style.opacity = 0;
              p3.style.opacity = 0;
              p4.style.opacity = 0;
	}
    else if (elementID == 'Page2') {
              p1.style.opacity = 0;
              p2.style.opacity = 1;
              p3.style.opacity = 0;
              p4.style.opacity = 0;
	}
    else if (elementID == 'Page3') {
              p1.style.opacity = 0;
              p2.style.opacity = 0;
              p3.style.opacity = 1;
              p4.style.opacity = 0;
	}
    else if (elementID == 'Page4') {
              p1.style.opacity = 0;
              p2.style.opacity = 0;
              p3.style.opacity = 0;
              p4.style.opacity = 1;
	}
}
</script>
</head>

<body>

<a href="#" onclick="show('Page1');">Knop1</a>
<a href="#" onclick="show('Page2');">Knop2</a>
<a href="#" onclick="show('Page3');">Knop3</a>
<a href="#" onclick="show('Page4');">Knop4</a>

<div class="PageWrapper">

<div class="page" id="Page1">
<p>Page1</p>
</div>

<div class="page" id="Page2">
<p>Page2</p>
</div>

<div class="page" id="Page3" >
<p>Page3</p>
</div>

<div class="page" id="Page4" >
<p>Page4</p>
</div>

</div>

</body>
</html>
 
Bedankt,
het enige probleem was dat ik = had gebruikt ipv ==
Mvg,
D95
 
Status
Niet open voor verdere reacties.
                    Steun ons                    

Nieuwste berichten

Terug
Bovenaan Onderaan