In uitbereiding op mijn vorige script wat ik hier postte en inmiddels werkt, heb ik het volgende gedaan:
<?
function getFirma(){
var firma = this.innerHTML;
document.getElementById("pic").setAttribute("src", "afbeeldingen/" + firma + "/1.jpg");
return false
}
?>
Wat het script doet:
Deze functie wordt aangeroepen nadat er op een link is geklikt.
Hij pakt de firma naam wat tussen <a> </a> staat.
De firma is gelijk aan de naam van het mapje waar de afbeelding in staat die hij moet laten zien. en 1.jpg heet.
vervolgens moet hij return false terug sturen omdat ik niet wil dat hij de page herlaad en opnieuw contact maakt met de server.
het probleem is dus dat hij de source van de image "pic" niet veranderd nadat ik op de link heb geklikt.
Wat doe ik hier fout?
* ipv .setAttribute heb ik ook al .src geprobeerd.
later wil ik dit script nog uitbouwen tot een slide show, maar laat m maar eerst eens de src veranderen.
[size=xsmall]Toevoeging op 16/01/2012 13:13:02:[/size]
Ik ben dmv page breaks erachter gekomen dat mijn return false niet werkt.
Hij laat de image dus wel zien, iemand een idee hoe dit op te lossen is?
Als de rest van het script nodig is dan hoor ik dat graag.
Bvd.
Wel ja, een aantal dingen ...
Ik weet niet hoe je getFirma aanroept.
Als getFirma een callback is (toegewezen aan een EventListener...), kan je this gebruiken. Als dat in de markup gebeurt kan dat niet.
Ook die return false wordt in beide gevallen op een andere manier gebruikt.
Denk er ook aan: als je een fout maakt in een functie, zal de functie niet volledig worden uitgevoerd en wordt die return false sowieso niet uitgevoerd. Je moet dus de problemen 1 voor 1 oplossen.
Kijk, ik denk dat je zoiets wil bereiken:
<html>
<head>
<script>
function getFirma(elm){
var firma = elm.innerHTML;
document.getElementById("pic").src = "afbeeldingen/" + firma + "/1.jpg";
return false
}
</script>
</head>
<body>
<a href="?p=2" onclick="return getFirma(this);">Ford</a>
<a href="?p=3" onclick="return getFirma(this);">Fiat</a>
<a href="?p=4" onclick="return getFirma(this);">Ferrari</a>
<img id="pic" src=""/>
</body>
</html>
... maar waarschijnlijk wil je dit niet via onclick="..." in de markup.
-----
Kan je iets van code doorsturen van hoe en waar je getFirma aanspreekt of toewijst aan een event?
Ben nu net mijn ogen aan het openen voor Javascript. Zal maar eens op zoek moeten gaan naar een Lynda Course voor jQuery.
Zal zelfs dat microsoft het aanbeveeld, dus dan kun je er echt niet meer onderuit. lol.
Heb het script nu wel werkend met je vorige voorbeeld door de onclick event in de link te zetten.
Wil het uitbouwen met een mooie fade. Hij fade wel, maar laten zien doet hij niet:
<?
function getFirma(ele){
var firma = ele.innerHTML;
document.getElementById("pic").src = "afbeeldingen/" + firma + "/1.jpg"
for (var i = 1; i < 99; i++){
setTimeout("fadeIn(" + i + ")",50);
}
return false
}
function fadeIn(i){
document.getElementById("pic").style.opacity = i/100;
}
?>
misschien dat je mij hier mee verder kan helpen?
Ik weet dat hij wel door de loop gaat maar niet de pauzes neemt (of laat zien) omdat ik de i < 100 veranderd heb in i < 50 en dan wel de opacity laat zien, maar er niet mooi naar toe fade.
