Printable View
ciao ragazzi! vorrei chiedervi se è possibile realizzare uno script che permetta di fare cio:
ci sono dei link, come ad esempio: ROSSO BLU VERDE
e cliccando su ogniuno di essi venga modificato il colore di sfondo della pagina e l'immagine di sfondo di due tabelle, ovvero clicco rosso e la pagina diventa sfondo rosso e le due tabelle che mi interessano mettono come sfondo l'immagine rossa, clicco blu.. sfondo blu immagine blu.. e cosi via..
capito?
GRAZIE!
Guarda questo tutorial.
Il link a cosa deve puntare????
all'immagine che sostituisce il background
Tra i tag head inserisci lo script:
Alle tabelle assegni due id.Codice HTML:<script language="Javascript" type="text/javascript">
function CambiaSfondo(colore) {
switch (colore) {
case "rosso":
immagine="immaginerosso.jpg";
colore="#FF0000";
break;
case "blu":
immagine="immagineblu.jpg";
colore="#0000FF";
break;
case "verde":
immagine="immagineverde.jpg";
colore="#00FF00";
break;
}
document.body.style.backgroundImage='url('+immagine+')';
document.getElementById("tabella1").style.backgroundColor=colore;
document.getElementById("tabella2").style.backgroundColor=colore;
}
</script>
Codice HTML:<table id="tabella1">
E poi metti i link così:Codice HTML:<table id="tabella2">
Codice HTML:<a href="javascript:CambiaSfondo('rosso')">Rosso</a>
<a href="javascript:CambiaSfondo('blu')">Blu</a>
<a href="javascript:CambiaSfondo('verde')">Verde</a>
Ma forse i link puntavano ad un'altra pagina web...........cmq al posto di
<a href="javascript:CambiaSfondo('verde')">Verde</a>
puoi mettere
<a onclick="CambiaSfondo('verde')">Verde</a>
Il parametro href bisogna metterlo quindi diventerà:Citazione:
Originalmente inviato da Vallauri06
Oppure:Codice HTML:<a href="#" onclick="CambiaSfondo('verde')">Verde</a>
Codice HTML:<a href="javascript:void(0)" onclick="CambiaSfondo('verde')">Verde</a>
Secondo me nn per forza
html non è un linguaggio di programmazione. href puoi metterlo o non metterlo funziona lo stesso. [edit] la pagina (se lo togli) sarà w3c compliant comunque non è campo required
Probabilmente hai ragione il W3C non dice niente a riguardo.Citazione:
Originalmente inviato da Vallauri06
grazie 1000 ragazzi. stavo per scrivervi che con quel tutorial non avevo risolto il problema, e invece vengo qui e trovo gia la soluzione! grazie mille!!! p.s. cmq il cambiamento doveva essere nella stessa pagina qnd cosi è perfetto. Grazie Mille!!! Siete sempre super-efficenti!
Di nulla!