ugrás a tartalomhoz

Nem akar menni a javascriptes analóg órám

Medve · 2009. Már. 9. (H), 21.12
Hello mindenki!
A segítségeteket szeretném kérni ugyanis azt gondoltam hogy képes vagyok már Javascript-ben írni egy analóg órát. háát ez részben be is jött ugyanis létrehoz mindent ami neki kell nem is ír ki hibát viszont nem akar mozogni a másdopercmutatóm(mert először csak egy mutatót akartam megforgatni).Arra szeretnélek kérni hogy valaki aki ért hozzá az nézze már ét nekem és mondja el nekem legyen szives hogy mi a baj vele.:D
  1. <HTML>  
  2. <HEAD>  
  3. <TITLE>ÓRA2</TITLE>  
  4.   
  5. <SCRIPT LANGUAGE='JavaScript'>  
  6. var M=5;  
  7. var P=4;  
  8. var O=3;  
  9. var kar=".";  
  10. var mszog=0;  
  11. var pszog=0;  
  12. var oszog=0;  
  13.   
  14. function analogora(){  
  15.   
  16. document.write('<div id="oralap" style="position:absolute;top:200px;left:300px;">');  
  17.   
  18.   
  19. init();  
  20. hatlap();  
  21. masodperc();  
  22. perc();  
  23. ora();  
  24. document.write('</div>');  
  25. }  
  26.   
  27. function init(){  
  28. var mnev,pnev,onev;  
  29.   
  30.   
  31.   
  32. for (var i=1 ; i <= M ; i++){  
  33. mnev="m"+i;  
  34. document.write('<div id="'+mnev+'" style="position:absolute;color:#ff0000;font-size:30;"><b>'+kar+'</b></div>');  
  35. }  
  36.   
  37. for (var i=1 ; i <= P ; i++){  
  38. pnev="p"+i;  
  39. document.write('<div id="'+pnev+'" style="position:absolute;color:#00ff00;font-size:30;"><b>'+kar+'</b></div>');  
  40. }  
  41.   
  42. for (var i=1 ; i <= O ; i++){  
  43. onev="o"+i;  
  44. document.write('<div id="'+onev+'" style="position:absolute;color:#0000ff;font-size:30;"><b>'+kar+'</b></div>');  
  45. }  
  46. document.write('<div id="kozeppont" style="position:absolute;color:#000000;font-size:30;left:2px;top:-15px;"><b>'+kar+'</b></div>');  
  47. }  
  48.   
  49. function masodperc(){  
  50. var bal,fent;  
  51.   
  52. if (mszog < (Math.PI*2)){  
  53. bal=Math.sin(mszog);  
  54. fent=Math.cos(mszog);  
  55.   
  56. m1.style.top=(fent*10)-15;  
  57. m1.style.left=(bal*10)+2;  
  58.   
  59. m2.style.top=(fent*20)-15;  
  60. m2.style.left=(bal*20)+2;  
  61.   
  62. m3.style.top=(fent*30)-15;  
  63. m3.style.left=(bal*30)+2;  
  64.   
  65. m4.style.top=(fent*40)-15;  
  66. m4.style.left=(bal*40)+2;  
  67.   
  68. m5.style.top=(fent*50)-15;  
  69. m5.style.left=(bal*50)+2;  
  70.   
  71. mszogmszog=mszog+(Math.PI/48);  
  72.   
  73. setTimeout('masodperc()',10);  
  74. }  
  75. else  
  76. {  
  77. mszog=0;  
  78. }  
  79.   
  80. var mp=setTimeout('masodperc()',10);  
  81. }  
  82.   
  83. function perc(){  
  84.   
  85. }  
  86.   
  87. function ora(){  
  88.   
  89. }  
  90.   
  91. function hatlap(){  
  92. var szog=0;  
  93. var bal,fent;  
  94.   
  95. for (var i=12; i >= 10 ;i--){  
  96. bal=-Math.sin(szog)*60;  
  97. fent=-Math.cos(szog)*60;  
  98. document.write('<div id="ora'+i+'" style="position:absolute;top:'+fent+'px;left:'+bal+'px;"><b>'+i+'</b></div>');  
  99. szogszog=szog+(Math.PI/6);  
  100. }  
  101. for (var i=9; i >= 1 ;i--){  
  102. bal=-Math.sin(szog)*60;  
  103. fent=-Math.cos(szog)*60;  
  104. document.write('<div id="ora'+i+'" style="position:absolute;top:'+fent+'px;left:'+bal+'px;"><b>&nbsp;'+i+'</b></div>');  
  105. szogszog=szog+(Math.PI/6);  
  106. }  
  107. }  
  108.   
  109.   
  110. </SCRIPT>  
  111. </HEAD>  
  112.   
  113. <BODY onLoad="analogora()">  
  114.   
  115. </BODY>  
  116. </HTML>  
Előre is köszi.
‹ Tabella készítés frame-target helyett valami más? ›
 ■
1

helló moto

domel · 2009. Már. 9. (H), 21.49
Helló!

Nálam itt száll el a programod:
  1. m1.style.top=(fent*10)-15;  
a fenti sorral első ránézésre nincs is gond, de:
  1. document.write('<div id="'+mnev+'" style="position:absolute;color:#ff0000;font-size:30;"><b>'+kar+'</b></div>');  
és a második sorral sincs gond :D DE! (mert ezzel már én is szívtam) az itt a gond, hogy a style-ben csak a meglévő dolgokat tudod állogatni.
Miről beszélek? m1.style.top azért nem tudod a topot állítani, mert nincs is ott.
style="position:absolute;color:#ff0000;font-size:30;" javítva
style="position:absolute;color:#ff0000;font-size:30;top:0"
lehet 0, vagy akármi, mert úgyis átállítod, mikor indul a program.

Lehet, hogy több hiba is van, de az egyik ez volt

-Xakk
2

Valami ilyesmi

Poetro · 2009. Már. 9. (H), 22.24
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">  
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">  
  3. <head>  
  4.     <title>ÓRA2</title>  
  5. </head>  
  6. <body>  
  7. <script type='text/javascript'>  
  8.   var M=5;  
  9.   var P=4;  
  10.   var O=3;  
  11.   var kar=".";  
  12.   var mszog=0;  
  13.   var pszog=0;  
  14.   var oszog=0;  
  15.     
  16.   function analogora(){  
  17.     var body = document.getElementsByTagName('body')[0];  
  18.     var oralap = document.createElement('DIV');  
  19.     oralap.setAttribute('style', 'position:absolute;top:200px;left:300px;');  
  20.     oralap.setAttribute('id', 'oralap');  
  21.     body.appendChild(oralap);  
  22.     init(oralap);  
  23.     hatlap(oralap);  
  24.     var mp = window.setInterval(masodperc, 500);  
  25.     perc();  
  26.     ora();  
  27.   }  
  28.     
  29.   function init(oralap){  
  30.     var mnev, pnev, onev , item, b;  
  31.     for (var i=1 ; i <= M ; i++){  
  32.       mnev = "m"+i;  
  33.       item = document.createElement('DIV');  
  34.       item.setAttribute('style', 'position:absolute;color:#ff0000;font-size:30;top:0;left:0;');  
  35.       item.setAttribute('id', mnev);  
  36.       b = document.createElement('B');  
  37.       b.appendChild(document.createTextNode(kar));  
  38.       item.appendChild(b);  
  39.       oralap.appendChild(item);  
  40.       window[mnev] = item;  
  41.     }  
  42.     
  43.     for (var i=1 ; i <= P ; i++){  
  44.       pnev="p"+i;  
  45.       var item = document.createElement('DIV');  
  46.       item.setAttribute('style', 'position:absolute;color:#00ff00;font-size:30;');  
  47.       item.setAttribute('id', pnev);  
  48.       b = document.createElement('B');  
  49.       b.appendChild(document.createTextNode(kar));  
  50.       item.appendChild(b);  
  51.       oralap.appendChild(item);  
  52.       window[pnev] = item;  
  53.     }  
  54.     
  55.     for (var i=1 ; i <= O ; i++){  
  56.       onev = "o"+i;  
  57.       item = document.createElement('DIV');  
  58.       item.setAttribute('style', 'position:absolute;color:#0000ff;font-size:30;');  
  59.       item.setAttribute('id', onev);  
  60.       b = document.createElement('B');  
  61.       b.appendChild(document.createTextNode(kar));  
  62.       item.appendChild(b);  
  63.       oralap.appendChild(item);  
  64.       window[onev] = item;  
  65.     }  
  66.     item = document.createElement('DIV');  
  67.     item.setAttribute('style', 'position:absolute;color:#000000;font-size:30;left:2px;top:-15px;');  
  68.     item.setAttribute('id', onev);  
  69.     b = document.createElement('B');  
  70.     b.appendChild(document.createTextNode(kar));  
  71.     item.appendChild(b);  
  72.     oralap.appendChild(item);  
  73.   }  
  74.     
  75.   function masodperc(){  
  76.     var bal,fent;  
  77.     var now = new Date();  
  78.     mszog = - now.getSeconds() * Math.PI / 30 + Math.PI;  
  79.     
  80.     bal=Math.sin(mszog);  
  81.     fent=Math.cos(mszog);  
  82.     
  83.     m1.style.top=((fent*10)-15) + "px";  
  84.     m1.style.left=((bal*10)+2) + "px";  
  85.     
  86.     m2.style.top=((fent*20)-15) + "px";  
  87.     m2.style.left=((bal*20)+2) + "px";  
  88.     
  89.     m3.style.top=((fent*30)-15) + "px";  
  90.     m3.style.left=((bal*30)+2) + "px";  
  91.     
  92.     m4.style.top=((fent*40)-15) + "px";  
  93.     m4.style.left=((bal*40)+2) + "px";  
  94.     
  95.     m5.style.top=((fent*50)-15) + "px";  
  96.     m5.style.left=((bal*50)+2) + "px";  
  97.   }  
  98.     
  99.   function perc(){  
  100.     
  101.   }  
  102.     
  103.   function ora(){  
  104.     
  105.   }  
  106.     
  107.   function hatlap(oralap){  
  108.     var szog=0;  
  109.     var bal, fent, item, b;  
  110.     
  111.     for (var i=12; i >= 10 ;i--){  
  112.       bal=-Math.sin(szog)*60;  
  113.       fent=-Math.cos(szog)*60;  
  114.     
  115.       item = document.createElement('DIV');  
  116.       item.setAttribute('style', 'position:absolute;top:'+fent+'px;left:'+bal+'px;');  
  117.       item.setAttribute('id', 'ora'+i);  
  118.       b = document.createElement('B');  
  119.       b.appendChild(document.createTextNode(i));  
  120.       item.appendChild(b);  
  121.       oralap.appendChild(item);  
  122.     
  123.       szogszog=szog+(Math.PI/6);  
  124.     }  
  125.     for (var i=9; i >= 1 ;i--){  
  126.       bal=-Math.sin(szog)*60;  
  127.       fent=-Math.cos(szog)*60;  
  128.     
  129.       item = document.createElement('DIV');  
  130.       item.setAttribute('style', 'position:absolute;top:'+fent+'px;left:'+bal+'px;');  
  131.       item.setAttribute('id', 'ora'+i);  
  132.       b = document.createElement('B');  
  133.       b.appendChild(document.createTextNode(" "+ i));  
  134.       item.appendChild(b);  
  135.       oralap.appendChild(item);  
  136.     
  137.       szogszog=szog+(Math.PI/6);  
  138.     }  
  139.   }  
  140.     
  141.   window.onload = analogora;  
  142.   
  143.   </script>  
  144.   </body>  
  145. </html>  
Persze még jócskán ráférne optimalizálás.
3

Köszi szépen!:D

Medve · 2009. Már. 12. (Cs), 11.42
kösz srácok most már mükszik rendesen.