Graphic Style

COME CREARE UN OROLOGIO

Volete creare un orologio come questo? Se la risposta è sì, seguite bene passo per passo come fare!

COME FARE?

1.Innanzitutto, dovrete avere a disposizione un'immagine, meglio se fatta da voi con Photoshop (andate tra i tutorial per Photoshop se volete imparare qualche effetto!^^). Di questa immagine appuntatevi altezza e larghezza (rispettivamente height e width) che vi serviranno tra poco! Attenzione: salvate l'immagine in formato GIF

2. Ora create una nuova pagina con FrontPage o con l'HTML (come faccio io), nominandola, ad esempio, "clock". Se usate FrontPage, andate sull'HTML ed ELIMINATE TUTTA LA PARTE GIA' SCRITTA, ossia i tag già presenti: quindi inserite questo script:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>Documento senza titolo</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <script language="JavaScript" type="text/JavaScript">  </script> </head> <body topmargin="0" leftmargin="0"> <script language="JavaScript"> // Clock Script Generated By Maxx Blade's Clock v2.0 // http://www.maxxblade.co.uk/clock function tS(){ x=new Date(); x.setTime(x.getTime()); return x; } function lZ(x){ return (x>9)?x:'0'+x; } function dT(){ window.status=''+eval(oT)+''; document.title=''+eval(oT)+''; if(fr==0){ fr=1; document.write('<font size=1 color=#000000 face=Verdana><b><span id="tP">'+eval(oT)+'</span></b></font>'); } tP.innerText=eval(oT); setTimeout('dT()',1000); } var fr=0,oT="lZ(tS().getHours())+':'+lZ(tS().getMinutes())+' '"; </script> <DIV STYLE="position : absolute; left : 0px; z-index : 0 ; top : 0;"><a style="text-decoration: none;" href="http://url tuo sito" border="0" target="_blank"><img src="URL IMMAGINE" border="0"></a></div> <div style="position: absolute; left: 35; top: 55; width: 170;"><a style="text-decoration: none;" href="http://url tuo sito" border="0" target="_blank"> <script language="JavaScript">dT();</script> </a> </div> </body> </html>

3. Molto bene, questo punto è fondamentale! Innanzitutto, scrivete al posto di URL IMMAGINE l'url dell'immagine scelta. Se avete un sito, scrivete al posto di "url tuo sito" l'url del sito. In questo modo, se un utente vedrà un orologio scaricato dal vostro sito e cliccherà su di esso accederà al vostro sito e potrà scaricarsi l'orologio che vuole! Ora, dove trovate scritto

"{ fr=1; document.write('font size=1 color=#000000 face=Verdana'+eval(oT)+''); }"

al posto di "verdana" e "#000000" inserite il font che volete usare per i numeri dell'ora e il codice cromatico equivalente al colore che volete dare al numero! ^^

4.Altro passo importante, la posizione dei numeri!!! Dove c'è scritto:

"div style="position: absolute; left: 35; top: 55; width: 170;""

cambierete i valori in pixel per determinare la DISTANZA in pixel di dove volete posizionare il div-layer con i numeri! Left indica i pixel dal bordo sinistro, top indica i pixel a partire da sotto la barra di navigazione (quella in alto dalla schermata browser) e widht indica la larghezza. Volete un consiglio? Inserite due valori casuali in left e top, osservate l'anteprima e, da lì, regolatevi come meglio credete!

5. Ora: se volete inserire l'orologio fatto da voi nel vostro sito, uppatelo sul vostro dominio in un percorso qualunque, prendetene nota. Ora, selezionate l'HTML della pagina in cui volete far comparire l'orologio e, nel punto esatto in cui volete farlo comparire:

<IFRAME style="FILTER: chroma(color=#FFFFFF)" border=0 frameSpacing=0 src="http://url pagina clock" frameBorder=0 width=103 scrolling=no height=68></IFRAME><br><br> inserite questo codice, scrivendo al posto di "url pagina clock" il percorso in cui avete uppato la pagina con l'orologio. Al posto di height e widht, inserite larghezza e altezza dell'immagine usata per l'orologio. vedete:<br><br> style="FILTER: chroma(color=#FFFFFF)"<br><br> questo permette di rendere trasparente il colore di sfondo usato per l'immagine se, come consigliato, avete salvato in formato gif l'immagine! ^_^ Se volete inserire l'orologio da scaricare nel vostro sito sarò sufficiente ricopiare lo script per frame usato prima (sempre in una textarea come quelle presenti qui) inserendo sempre il percorso dell'orologio! </p> <p align="left">Bene, io mi fermo qui! ^^ So che può sembrare non facilissimo il metodo che uso io, ma, dopo un pò che lo usate, vi ci abituerete di sicuro! Se avete problemi contattatemi! E se volete fare degli orologio per noi, inviateci pure l'immagine e la pagina con l'orologio (inviatela a me, fate prima!^^) e saremo felicissime di pubblicare i vostri orologio, con dovuti credits! ^_^</p> </body> </html>