Visualizzazione dei risultati da 1 a 2 su 2

Discussione: Orologio analogico js

  1. #1
    Utente di HTML.it
    Registrato dal
    Mar 2010
    Messaggi
    9

    Orologio analogico js

    Ciao ragazzi!

    Ho un problema assurdo con uno script di un semplice orologio analogico. Tutto funziona perfettamente (solo in IE: per semplicità ho eliminato il codice che si riferiva agli altri browser), ma se inserisco il DOCTYPE nella pagina html spariscono le lancette dall'orologio!
    Googlando un po' ho trovato numerosi 3d che trattano il problema, ma non riesco a venirne a capo, dato che il codice non va in errore e continua a ciclare correttamente.

    HELP! Ecco il codice con il doctype specificato (e quindi non funziona):

    codice:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html>
    <head>
    
    </head>
    
    <body id="pippo">
    <input type="text" id="bottone" onclick="allerta();" />
    <div>
    
    
    
    
    
    
    
    Test orologio analogico in js (per ora funziona solo in IE)</div>
    <script type="text/javascript">
    function allerta() {
    	alert(document.getElementById('pippo'));
    }
    </script>
    <script type="text/javascript">	
    fCol='444444';
    sCol='FF0000';
    mCol='444444';
    hCol='444444';
    
    Ybase=30; 
    Xbase=30; 
    
    
    H='...';
    H=H.split('');
    M='....';
    M=M.split('');
    S='.....';
    S=S.split('');
    alert(document.getElementById('pippo'));
    IE4=(document.getElementById('pippo'));
    Ypos=0;
    Xpos=0;
    dots=12;
    Split=360/dots;
    
    if (IE4){
    	document.write('<div style="position:absolute;top:0px;left:0px"><div style="position:relative">');
    	for (i=1; i < dots+1; i++){
    	document.write('<div id="ieDigits" style="position:absolute;top:0px;left:0px;width:30px;height:30px;font-family:Arial;font-size:10px;color:'+fCol+';text-align:center;padding-top:10px">'+i+'</div>');
    	}
    	document.write('</div></div>')
    	document.write('<div style="position:absolute;top:0px;left:0px"><div style="position:relative">');
    	for (i=0; i < M.length; i++){
    	document.write('<div id=y style="position:absolute;width:2px;height:2px;font-size:2px;background:'+mCol+'"></div>');
    	}
    	document.write('</div></div>')
    	document.write('<div style="position:absolute;top:0px;left:0px"><div style="position:relative">');
    	for (i=0; i < H.length; i++){
    	document.write('<div id=z style="position:absolute;width:2px;height:2px;font-size:2px;background:'+hCol+'"></div>');
    	}
    	document.write('</div></div>')
    	document.write('<div style="position:absolute;top:0px;left:0px"><div style="position:relative">');
    	for (i=0; i < S.length; i++){
    	document.write('<div id=x style="position:absolute;width:2px;height:2px;font-size:2px;background:'+sCol+'"></div>');
    	}
    	document.write('</div></div>')
    }
    
    
    
    
    function startclock(){
    	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.57 + Math.PI * hr/6 + Math.PI*parseInt(time.getMinutes())/360;
    	
    	if (IE4){
    	Ypos=document.body.scrollTop+window.document.body.clientHeight-Ybase-20;
    	Xpos=document.body.scrollLeft+window.document.body.clientWidth-Xbase-20;
    	for (i=0; i < dots; ++i){
    	 ieDigits[i].style.pixelTop=Ypos-15+Ybase*Math.sin(-1.045 +i *Split*Math.PI/180)
    	 ieDigits[i].style.pixelLeft=Xpos-15+Xbase*Math.cos(-1.045 +i *Split*Math.PI/180)
    	 }
    	for (i=0; i < S.length; i++){
    	 x[i].style.pixelTop =Ypos+i*Ybase/4.1*Math.sin(sec);
    	 x[i].style.pixelLeft=Xpos+i*Xbase/4.1*Math.cos(sec);
    	 }
    	for (i=0; i < M.length; i++){
    	 y[i].style.pixelTop =Ypos+i*Ybase/4.1*Math.sin(min);
    	 y[i].style.pixelLeft=Xpos+i*Xbase/4.1*Math.cos(min);
    	 }
    	for (i=0; i < H.length; i++){
    	 z[i].style.pixelTop =Ypos+i*Ybase/4.1*Math.sin(hrs);
    	 z[i].style.pixelLeft=Xpos+i*Xbase/4.1*Math.cos(hrs);
    	 }
    	}
    	setTimeout('startclock()',100);
    }
    
    startclock();
    </script>
    
    </body>
    </html>

  2. #2
    Causa:
    XHTML 1.0 Transitional => Non c'è la funzione document.write in JS

    Soluzione:
    O cambi il Doctype in HTML 4.0 o cambi lo script affinché non usi il document.write
    I DON'T Double Click!

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.