zoukankan      html  css  js  c++  java
  • javascript实例 —指针式时钟

     
    查看文章
     
    2007-07-06 15:49

    <html>
    <head>
    <title>
    时钟
    </title>
    <SCRIPT language=javascript>
    <!--
    pX=400;pY=200
    obs = new Array(13)
    function ob () {
    for (i=0; i<13; i++) {
         if (document.all) obs[i]=new Array (eval('ob'+i).style,-100,-100)
         else obs[i] = new Array (eval('document.ob'+i),-100,-100)
         }
    }
    function cl(a,b,c){
         if (document.all) {
             if (a!=0) b+=-1
             eval('c'+a+'.style.pixelTop='+(pY+(c)))
             eval('c'+a+'.style.pixelLeft='+(pX+(b)))
             }
    else{
         if (a!=0) b+=10
         eval('document.c'+a+'.top='+(pY+(c)))
         eval('document.c'+a+'.left='+(pX+(b)))
    }
    if (document.all) c0.style.pixelLeft=26
    }

    function runClock() {
         for (i=0; i<13; i++) {
             obs[i][0].left=obs[i][1]+pX
             obs[i][0].top=obs[i][2]+pY
         }
    }

    var lastsec
    function timer() {
         time = new Date ()
         sec = time.getSeconds()
         if (sec!=lastsec) {

             lastsec = sec
             sec=Math.PI*sec/30
             min=Math.PI*time.getMinutes()/30
             hr =Math.PI*((time.getHours()*60)+time.getMinutes())/360
             for (i=1;i<6;i++) {
                 obs[i][1] = Math.sin(sec) * (44 - (i-1)*11)-16;
                 if (document.layers)obs[i][1]+=10;
                 obs[i][2] = -Math.cos(sec) * (44 - (i-1)*11)-27;
             }
             for (i=6;i<10;i++) {
                 obs[i][1] = Math.sin(min) * (40 - (i-6)*10)-16;
                 if (document.layers)obs[i][1]+=10;
                 obs[i][2] = -Math.cos(min) * (40 - (i-6)*10)-27;
             }
             for (i=10;i<13;i++) {
                 obs[i][1] = Math.sin(hr) * (37 - (i-10)*11)-16;
                 if (document.layers)obs[i][1]+=10;
                 obs[i][2] = -Math.cos(hr) * (37 - (i-10)*11)-27;
             }
         }

    }
    function setNum(){

    cl (0,-67,-65);
    cl (1,10,-51);
    cl (2,28,-33);
    cl (3,35,-8);
    cl (4,28,17);
    cl (5,10,35);
    cl (6,-15,42);
    cl (7,-40,35);
    cl (8,-58,17);
    cl (9,-65,-8);
    cl (10,-58,-33);
    cl (11,-40,-51);
    cl (12,-16,-56);

    }

    //-->


    </SCRIPT>


    </head>

    <body onLoad="ob(),setNum(),setInterval('timer()',100);setInterval('runClock()',100)">
    <font size=25 color=blue>玄魂制作</font>
    <div id="c0" style="position:absolute;right:6;top:33px; z-index:2;; left: 24px">
    </div>
             <div id="c1" style="position:absolute;left:20;top:-20; z-index:5;font-size:11px;"><b>1</b></div>
             <div id="c2" style="position:absolute;left:20;top:-20; z-index:5;font-size:11px;"><b>2</b></div>
             <div id="c3" style="position:absolute;left:20;top:-20; z-index:5;font-size:11px;"><b>3</b></div>
             <div id="c4" style="position:absolute;left:20;top:-20; z-index:5;font-size:11px;"><b>4</b></div>
             <div id="c5" style="position:absolute;left:20;top:-20; z-index:5;font-size:11px;"><b>5</b></div>
             <div id="c6" style="position:absolute;left:20;top:-20; z-index:5;font-size:11px;"><b>6</b></div>
             <div id="c7" style="position:absolute;left:20;top:-20; z-index:5;font-size:11px;"><b>7</b></div>
             <div id="c8" style="position:absolute;left:20;top:-20; z-index:5;font-size:11px;"><b>8</b></div>
             <div id="c9" style="position:absolute;left:20;top:-20; z-index:5;font-size:11px;"><b>9</b></div>
             <div id="c10" style="position:absolute;left:20;top:-20; z-index:5;font-size:11px;"><b>10</b></div>
             <div id="c11" style="position:absolute;left:20;top:-20; z-index:5;font-size:11px;"><b>11</b></div>
             <div id="c12" style="position:absolute;left:20;top:-20; z-index:5;font-size:11px;"><b>12</b></div>
             <div id="ob0" style="position:absolute;left:-20;top:-20;z-index:1">   </div>
             <div id="ob1" style="position:absolute;left:-20;top:-20;z-index:8"> <font size="+3" color="#0000FF"><b>.</b></font></div>
             <div id="ob2" style="position:absolute;left:-20;top:-20;z-index:8"> <font size="+3" color="#0000FF"><b>.</b></font></div>
             <div id="ob3" style="position:absolute;left:-20;top:-20;z-index:8"> <font size="+3" color="#0000FF"><b>.</b></font></div>
             <div id="ob4" style="position:absolute;left:-20;top:-20;z-index:8"> <font size="+3" color="#0000FF"><b>.</b></font></div>
            
    <div id="ob5" style="position:absolute;left:-19px;top:31px;z-index:8"> <font size="+3" color="#0000FF"><b>.</b></font></div>
             <div id="ob6" style="position:absolute;left:-20;top:-20;z-index:7"> <font size="+3" color="#00FFFF"><b>.</b></font></div>
             <div id="ob7" style="position:absolute;left:-20;top:-20;z-index:7"> <font size="+3" color="#00FFFF"><b>.</b></font></div>
             <div id="ob8" style="position:absolute;left:-20;top:-20;z-index:7"> <font size="+3" color="#00FFFF"><b>.</b></font></div>
             <div id="ob9" style="position:absolute;left:-20;top:-20;z-index:7"> <font size="+3" color="#00FFFF"><b>.</b></font></div>
             <div id="ob10" style="position:absolute;left:-20;top:-20;z-index:6"> <font size="+3" color="#F30000"><b>.</b></font></div>
             <div id="ob11" style="position:absolute;left:-20;top:-20;z-index:6"> <font size="+3" color="#F30000"><b>.</b></font></div>
             <div id="ob12" style="position:absolute;left:-20;top:-20;z-index:6"> <font size="+3" color="#F30000"><b>.</b></font></div>


    </body>
    </html>

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    .
    .
    .
    .
    .
    .
    .
    .
    .
    .
    .
    .


    作者:玄魂
    出处:http://www.cnblogs.com/xuanhun/
    原文链接:http://www.cnblogs.com/xuanhun/ 更多内容,请访问我的个人站点 对编程,安全感兴趣的,加qq群:hacking-1群:303242737,hacking-2群:147098303,nw.js,electron交流群 313717550。
    本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。
    关注我:关注玄魂的微信公众号

  • 相关阅读:
    ExecuteScalar requires the command to have a transaction when the connection assigned to the command is in a pending
    如何从vss中分离程序
    String or binary data would be truncated
    the pop3 service failed to retrieve authentication type and cannot continue
    The POP3 service failed to start because
    IIS Error he system cannot find the file specified _找不到页面
    pku2575Jolly Jumpers
    pku2940Wine Trading in Gergovia
    pku3219二项式系数
    pku1029false coin
  • 原文地址:https://www.cnblogs.com/xuanhun/p/1662433.html
Copyright © 2011-2022 走看看