PDA

View Full Version : HTML


Federix
27-01-2007, 10:26
Salve, non sono un assiduo frequentatore di questo forum, ma rispetto ogni singolo utente ed è per questo che volevo un piacere. Ho notato che in molti sanno usare Javascript e HTML, volevo una mano per poter inserire del contenuto attivo in una mia pagina internet, se magari potete propormi qualche script java divertente o qualche sito ne sarei felicissimo.
Grazie in anticipo :D

MEMon
27-01-2007, 11:07
Dai su ma le idee???? Come fate a non sapere cosa fare...

Cos'hai in mente? cosa vorresti vedere sulla tua pagina web?

ps.javascript non è script java, java non centra nulla con javascript :D

mapomapo
27-01-2007, 11:08
www.html.it - vi son guide basilari e pezzi di codice già fatto..

Vito

Federix
27-01-2007, 14:01
Sono abbastanza bravo a fare pagine HTML, il problema è che non trovo i tag che mi servono per poter realizzare del contenuto attivo, come uno sfondo che cambia colore in automatico, o invece che colore foto, magari prese tutte dalla stessa fonte, e facessero cambiare le foto in dissolvenza e non di scatto. E in più mi serviva un MINI-giochino tanto per divertirsi, proprio una cosa BASILARE in quanto non so programmare. Spero che ora sia stato più chiaro, altrimenti vi fo un disegnino :D :D :D

MEMon
27-01-2007, 14:32
TI devi andare a guardare propietà e metodi DOM e impare i rudimenti del javascript.
Fortunatamente in rete si trova tantissima roba su ste cose.
Comunque ti scrivo un semplice esempio che fa cambiare colore ad un div ogni tot tempo.
Così puoi già vedere alcune cosette.

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html ;charset=iso-8859-1" />
<title>Div che cambia colore by Allejp</title>
<script type="text/javascript">

var colori=["blue","red","yellow","green","cyan","black","pink","brown","DEEPPINK","CORNFLOWERBLUE","DODGERBLUE","PLUM","PERU","orange","LIGHTGREEN"];
var timerID=null;

function getDiv(){
return document.getElementById("color_div");
}

function cambiaColore(){
var random=Math.round(Math.random()*(colori.length-1));
var myDiv=getDiv();
myDiv.style.backgroundColor=colori[random];
}

function setTimer(){
var delay=document.getElementById("timer_delay").value;
delay=parseInt(delay,10);
if(timerID){
clearInterval(timerID);
timerID=null;
}
timerID=setInterval(cambiaColore,delay);
}

function init(){
setTimer();
}
</script>
<body onload="init();">
<div id="color_div" style="width:500px;height:500px;border:1px solid black"></div>
<span><input id="timer_delay" type="text" value="2000" style="margin:30px 10px 0px 0px" onchange="setTimer();"/>milliseconds</span>
</body>
</html>

Federix
27-01-2007, 14:45
*EDIT*

Federix
27-01-2007, 14:49
Scusami, altrimenti invece di cambiare le foto, mi va bene questo, l'ultima cosa che vorrei è la spiegazione(se possibile) di inserire qualcosa ad ogni colore. Es.
Quando appare il blu c'è una nave
Quando appare il rosa una donna
E così via...

Ti prego dimmi che si può fare(e come) :D :D

MEMon
27-01-2007, 15:02
Si può fare, visto che hai detto che sei bravo a creare pagine HTML, di sicuro conoscerai e saprai usare i CSS, i quali attribuiscono ad ogni elemnto html tantissime proprietà, tra le quali anche il background-image.
Quindi se vuoi cambiare immagine ti basta cambiare il valore di questa proprità e per farlo utilizzi metodi DOM(vatti a vedere le references dai...).
Ti modifico l'esempio fatto prima facendo cambiare immagini.

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html ;charset=iso-8859-1" />
<title>Div che cambia colore by Allejp</title>
<script type="text/javascript">

var images=["http://www.corriere.it/Hermes%20Foto/2002/07_Luglio/11/NAVE--550x342.JPG","http://www.corriere.it/Media/Foto/2004/01_Gennaio/05/PAPERA.jpg","http://www.zeropaid.com/bbs/gallery/files/1/5/9/0/2/5/Adriana.Lima-lingerie.1-ALUn23.jpg",
"http://www.tshirtwatch.com/blog/wp-content/uploads/2006/05/adriana-lima-sexy-tshirt.jpg",
"http://www.ukmin.lt/lt/atashe/images/Italia-Bandiera.png",
"http://www.interarteonline.com/Walter_Fornero/altas/Tigre.jpg",
"http://www.mrx.no/albums/album154/35717809_WhiteTigerDodged.jpg"];
var timerID=null;

function getDiv(){
return document.getElementById("color_div");
}

function cambiaImmagine(){
var random=Math.round(Math.random()*(images.length-1));
var myDiv=getDiv();
myDiv.style.backgroundImage="url("+images[random]+")";
}

function setTimer(){
var delay=document.getElementById("timer_delay").value;
delay=parseInt(delay,10);
if(timerID){
clearInterval(timerID);
timerID=null;
}
timerID=setInterval(cambiaImmagine,delay);
}

function init(){
setTimer();
}
</script>
<body onload="init();">
<div id="color_div" style="width:500px;height:500px;background-repeat:no-repeat"></div>
<span><input id="timer_delay" type="text" value="2000" style="margin:30px 10px 0px 0px" onchange="setTimer();"/>milliseconds</span>
</body>
</html>