Modifica a orologio che segue il mouse

03-05-2004, 17.27.57

Come posso modificare questo script in modo che l' orologio non segua il mouse ma sia fermo in una posizione prestabilita? E' possibile far in modo che l'orologio segua il mouse quando il mouse è su quella pagina ma che poi ritorni in una determinata posizione quando il mouse non è sulla pagina in cui è inserito lo script?





<BODY>









<script language="JavaScript">

dCol='000000';//date colour.

fCol='000000';//face colour.

sCol='000000';//seconds colour.

mCol='000000';//minutes colour.

hCol='000000';//hours colour.

ClockHeight=40;

ClockWidth=40;

ClockFromMouseY=0;

ClockFromMouseX=100;

//Alter nothing below! Alignments will be lost!

d=new Array("SUNDAY","MONDAY","TUESDAY","WEDNESDAY","THU RSDAY","FRIDAY","SATURDAY");

m=new Array("JANUARY","FEBRUARY","MARCH","APRIL","MAY"," JUNE","JULY","AUGUST","SEPTEMBER","OCTOBER","NOVEM BER","DECEMBER");

date=new Date();

day=date.getDate();

year=date.getYear();

if (year < 2000) year=year+1900;

TodaysDate=" "+d[date.getDay()]+" "+day+" "+m[date.getMonth()]+" "+year;

D=TodaysDate.split('');

H='...';

H=H.split('');

M='....';

M=M.split('');

S='.....';

S=S.split('');

Face='1 2 3 4 5 6 7 8 9 10 11 12';

font='Arial';

size=1;

speed=0.6;

ns=(document.layers);

ie=(document.all);

Face=Face.split(' ');

n=Face.length;

a=size*10;

ymouse=0;

xmouse=0;

scrll=0;

props="<font face="+font+" size="+size+" color="+fCol+"><B>";

props2="<font face="+font+" size="+size+" color="+dCol+"><B>";

Split=360/n;

Dsplit=360/D.length;

HandHeight=ClockHeight/4.5

HandWidth=ClockWidth/4.5

HandY=-7;

HandX=-2.5;

scrll=0;

step=0.06;

currStep=0;

y=new Array();x=new Array();Y=new Array();X=new Array();

for (i=0; i < n; i++){y[i]=0;x[i]=0;Y[i]=0;X[i]=0}

Dy=new Array();Dx=new Array();DY=new Array();DX=new Array();

for (i=0; i < D.length; i++){Dy[i]=0;Dx[i]=0;DY[i]=0;DX[i]=0}

if (ns){

for (i=0; i < D.length; i++)

document.write('<layer name="nsDate'+i+'" top=0 left=0 height='+a+' width='+a+'><center>'+props2+D[i]+'</font></center></layer>');

for (i=0; i < n; i++)

document.write('<layer name="nsFace'+i+'" top=0 left=0 height='+a+' width='+a+'><center>'+props+Face[i]+'</font></center></layer>');

for (i=0; i < S.length; i++)

document.write('<layer name=nsSeconds'+i+' top=0 left=0 width=15 height=15><font face=Arial size=3 color='+sCol+'><center><b>'+S[i]+'</b></center></font></layer>');

for (i=0; i < M.length; i++)

document.write('<layer name=nsMinutes'+i+' top=0 left=0 width=15 height=15><font face=Arial size=3 color='+mCol+'><center><b>'+M[i]+'</b></center></font></layer>');

for (i=0; i < H.length; i++)

document.write('<layer name=nsHours'+i+' top=0 left=0 width=15 height=15><font face=Arial size=3 color='+hCol+'><center><b>'+H[i]+'</b></center></font></layer>');

}

if (ie){

document.write('<div id="Od" style="position:absolute;top:0px;left:0px">< div style="position:relative">');

for (i=0; i < D.length; i++)

document.write('<div id="ieDate" style=" position:absolute;top:0px;left:0;height:
'+a+';width:'+a+';text-align:center">'+props2+D[i]+'</B></font></div>');

document.write('</div></div>');

document.write('<div id="Of" style="position:absolute;top:0px;left:0px">< div style="position:relative">');

for (i=0; i < n; i++)

document.write('<div id="ieFace" style=" position:absolute;top:0px;left:0;height:
'+a+';width:'+a+';text-align:center">'+props+Face[i]+'</B></font></div>');

document.write('</div></div>');

document.write('<div id="Oh" style="position:absolute;top:0px;left:0px">< div style="position:relative">');

for (i=0; i < H.length; i++)

document.write('<div id="ieHours" style=" position:absolute;width:16px;height:16px
;font-family:Arial;font-size:16px;color:'+hCol+';text-align:center;font-weight:bold">'+H[i]+'</div>');

document.write('</div></div>');

document.write('<div id="Om" style="position:absolute;top:0px;left:0px">< div style="position:relative">');

for (i=0; i < M.length; i++)

document.write('<div id="ieMinutes" style=" position:absolute;width:16px;height:16px
;font-family:Arial;font-size:16px;color:'+mCol+';text-align:center;font-weight:bold">'+M[i]+'</div>');

document.write('</div></div>')

document.write('<div id="Os" style="position:absolute;top:0px;left:0px">< div style="position:relative">');

for (i=0; i < S.length; i++)

document.write('<div id="ieSeconds" style=" position:absolute;width:16px;height:16px
;font-family:Arial;font-size:16px;color:'+sCol+';text-align:center;font-weight:bold">'+S[i]+'</div>');

document.write('</div></div>')

}

(ns)?window.captureEvents(Event.MOUSEMOVE):0;

function Mouse(evnt){

ymouse = (ns)?evnt.pageY+ClockFromMouseY-(window.pageYOffset):event.y+ClockFromMouseY;

xmouse = (ns)?evnt.pageX+ClockFromMouseX:event.x+ClockFromM ouseX;

}

(ns)?window.onMouseMove=Mouse:document.onmousemove =Mouse;

function ClockAndAssign(){

time = new Date ();

secs = time.getSeconds();

sec = -1.57 + Math.PI * secs/30;

mins = time.getMinutes();

min = -1.57 + Math.PI * mins/30;

hr = time.getHours();

hrs = -1.575 + Math.PI * hr/6+Math.PI*parseInt(time.getMinutes())/360;

if (ie){

Od.style.top=window.document.body.scrollTop;

Of.style.top=window.document.body.scrollTop;

Oh.style.top=window.document.body.scrollTop;

Om.style.top=window.document.body.scrollTop;

Os.style.top=window.document.body.scrollTop;

}

for (i=0; i < n; i++){

var F=(ns)?document.layers['nsFace'+i]:ieFace[i].style;

F.top=y[i] + ClockHeight*Math.sin(-1.0471 + i*Split*Math.PI/180)+scrll;

F.left=x[i] + ClockWidth*Math.cos(-1.0471 + i*Split*Math.PI/180);

}

for (i=0; i < H.length; i++){

var HL=(ns)?document.layers['nsHours'+i]:ieHours[i].style;

HL.top=y[i]+HandY+(i*HandHeight)*Math.sin(hrs)+scrll;

HL.left=x[i]+HandX+(i*HandWidth)*Math.cos(hrs);

}

for (i=0; i < M.length; i++){

var ML=(ns)?document.layers['nsMinutes'+i]:ieMinutes[i].style;

ML.top=y[i]+HandY+(i*HandHeight)*Math.sin(min)+scrll;

ML.left=x[i]+HandX+(i*HandWidth)*Math.cos(min);

}

for (i=0; i < S.length; i++){

var SL=(ns)?document.layers['nsSeconds'+i]:ieSeconds[i].style;

SL.top=y[i]+HandY+(i*HandHeight)*Math.sin(sec)+scrll;

SL.left=x[i]+HandX+(i*HandWidth)*Math.cos(sec);

}

for (i=0; i < D.length; i++){

var DL=(ns)?document.layers['nsDate'+i]:ieDate[i].style;

DL.top=Dy[i] + ClockHeight*1.5*Math.sin(currStep+i*Dsplit*Math.PI/180)+scrll;

DL.left=Dx[i] + ClockWidth*1.5*Math.cos(currStep+i*Dsplit*Math.PI/180);

}

currStep-=step;

}

function Delay(){

scrll=(ns)?window.pageYOffset:0;

Dy[0]=Math.round(DY[0]+=((ymouse)-DY[0])*speed);

Dx[0]=Math.round(DX[0]+=((xmouse)-DX[0])*speed);

for (i=1; i < D.length; i++){

Dy[i]=Math.round(DY[i]+=(Dy[i-1]-DY[i])*speed);

Dx[i]=Math.round(DX[i]+=(Dx[i-1]-DX[i])*speed);

}

y[0]=Math.round(Y[0]+=((ymouse)-Y[0])*speed);

x[0]=Math.round(X[0]+=((xmouse)-X[0])*speed);

for (i=1; i < n; i++){

y[i]=Math.round(Y[i]+=(y[i-1]-Y[i])*speed);

x[i]=Math.round(X[i]+=(x[i-1]-X[i])*speed);

}

ClockAndAssign();

setTimeout('Delay()',20);

}

if (ns||ie)window.onload=Delay;

</script>

<p><center>

<font face="arial, helvetica" size"-2">Free JavaScripts provided<br>

by <a href="http://javascriptsource.com">The JavaScript Source</a></font>

</center><p>

Ospite · 03-05-2004, 19.45.27

Non ti sfiora l'idea che a uno che entra nel tuo sito rompa le palle caricarsi Kb in più di roba, per un orologio (di cui non capisco l'utilità) che sta fermo in un frame? :?

03-05-2004, 20.00.57

Non mi sembra che inserendo l' orologio ( secondo me carino ) ci sia anche un' infinità di roba da caricare da rendere inaccessibile il sito, perciò l' idea che dici tu non mi ha sfiorato.

**chrisbiro** · 03-05-2004, 20.01.41

Originalmente inviato da Pepper

Non ti sfiora l'idea che a uno che entra nel tuo sito rompa le palle caricarsi Kb in più di roba, per un orologio (di cui non capisco l'utilità) che sta fermo in un frame? :?

Quoto

04-05-2004, 00.45.32

1) come è espressamente indicato (in inglese) non è gradito modificare lo script (come per tutti)

2) guarda bene in giro perché personalmente ho visto molti più script con orologi "fermi" che quelli che inseguono il mouse, dunque già sono pronti come vuoi tu.

(may the Google be with you) :D

**Taitaonline** · 04-05-2004, 11.01.36

Personalmente, per me non è un problema di "scaricarmi Kb in più" come dice il Pepper, ma più che altro, a me darebbe fastidio qualunque cosa che "si aggiri" nei pressi del puntatore; a mio modesto parere potrebbe impedire una corretta lettura degli scritti sulla pagina.......
Ma, come si suol dire: "Il sito è mio e faccio ciò che voglio"...... o no ?

Prova semmai a cercare un puntatore animato che abbia quelle funzioni... Magari esiste, chessò.......

04-05-2004, 11.37.43

Forse mi sono spiegata male o forse siete solo in vena di spam. Non ho postato per avere commenti sulla funzionalità o meno dello script. Era una mia curiosità sapere se poteva essere modificato, mi interessavano solo delucidazioni tecniche non opinioni personali.

**gve** · 04-05-2004, 11.53.39

Per adattarlo credo si possa fare, ma lo script e` un po' lunghetto e ora non ho tempo di guardarlo; come ha detto NoSpam ci sono script simili che fanno gia` quello che cerchi, prova a cercare , ad esempio su html.it , qualcosa dovresti trovare.

Ospite · 04-05-2004, 14.45.19

Originalmente inviato da nemoprincess

Non mi sembra che inserendo l' orologio ( secondo me carino ) ci sia anche un' infinità di roba da caricare da rendere inaccessibile il sito, perciò l' idea che dici tu non mi ha sfiorato.

Credi che serva sapere l'ora a uno che entra nel tuo sito? Non sai che nella system tray c'è un orologio? Allora non vedo perché dovresti aggiungere roba in più (che a me non infastidisce, perché ho l'ADSL) da far caricare a chi ha modem lenti.

04-05-2004, 15.02.45

Originalmente inviato da Pepper

Credi che serva sapere l'ora a uno che entra nel tuo sito? Non sai che nella system tray c'è un orologio? Allora non vedo perché dovresti aggiungere roba in più (che a me non infastidisce, perché ho l'ADSL) da far caricare a chi ha modem lenti.

Ma insomma qual è il tuo problema? Ho chiesto forse un parere sull' utilità dello script? E poi ho forse obbligato qualcuno a vedere il mio sito e perciò a scaricarsi questo mare di inutilità?
Inoltre anch' io ho un modem lento e posso assicurarti che il motivo per cui non mi sono posta il problema che tu hai è che non noto la differenza con o senza l' orologio.
L' orologio mi piaceva perciò volevo inserirlo. Tu non hai mai messo nulla sul tuo sito solo per renderlo più carino ?
A meno che questo non vada ad influitre notevolmente sui tempi di caricamento mi spieghi che male c' è?
Perchè ti inserisci in una discussione di cui non hai competenze?

**gve** · 04-05-2004, 15.21.05

Lo script qui riportato sono 8kb, non mi sembra eccessivo per un 56k (una stupida immagine normalmente ha un peso superiore), anche se il codice javascript potrebbe comportare rallentamenti nell'esecuzione del sito su certi PC non troppo recenti, e inoltre alcuni javascript hanno problemi di compatibilita' a seconda del browser.

Detto cio', e' lecito esprimere la propria opinione (compreso affermare che una soluzione del genere non piace, o viene ritenuta invasiva) e dare suggerimenti, o sconsigliarla, ma vi prego di rimanere nell'ambito della correttezza, senza originare flame o saro' costretto a intervenire.

Nemoprincess ha chiesto come attuare una certa cosa, se sapete attuarla e ne avete tempo dategli una mano; altrimenti date pure i vostri consigli, ma vi avviso che se la discussione degenera in un flame dovro' bloccare il thread. Inoltre c'e' la possibilita' di ulteriori provvedimenti verso i responsabili (leggete il regolamento del forum al riguardo).

04-05-2004, 17.36.12

Come disse tale Garibaldi: "Obbedisco"

Questo è il pezzo di codice da rimuovere o commentare:

(ns)?window.captureEvents(Event.MOUSEMOVE):0;

function Mouse(evnt){

ymouse = (ns)?evnt.pageY+ClockFromMouseY-(window.pageYOffset):event.y+ClockFromMouseY;

xmouse = (ns)?evnt.pageX+ClockFromMouseX:event.x+ClockFromM ouseX;

}

(ns)?window.onMouseMove=Mouse:document.onmousemove =Mouse;

Senza questo pezzo di codice il clock rimane fermo.

Solo che ovviamente si trova a coordinate 0,0 (alto a sinistra)
per impostare le coordinate nello schermo trova le righe:
ymouse=0;
xmouse=0;

e scegli il valore di x e y che vuoi per posizionarlo.

nota bene:
- la posizione è assoluta rispetto allo schermo.
- per commentare più righe devi aggiungere /* prima e */ dopo il pezzo da commentare. Altrimenti cancellale e via anche se è uno sfregio nei confronti dell'autore :?
- lo script prevede solo netscape e explorer (con Mozilla non funge, anche se "potrebbe"... ma mica posso fa tutto io

:D )

Dimenticavo:
per chi volesse copiare tutto il codice dal post di nemoprincess attenzione che alcune righe sono state spezzate dunque dà parecchi errori (unterminated string..)

05-05-2004, 09.31.43

Grazie mille NoSpam per l' aiuto.

05-05-2004, 12.45.45

Di nulla, sono andato a vedere da te per curiosità e il risultato mi sembra ottimo (soprattutto perché, seppur fisso, c'è comunque lo spostamento iniziale, quella transizione verso le cooridnate fisse che fa molto cool :P ).

05-05-2004, 13.52.06

Sono contenta che ti piaccia...così non sono più l' unica ad apprezzare!

Discussione: Modifica a orologio che segue il mouse

LinkBack

Strumenti discussione

Display

Regole di scrittura