kostenloser Webspace werbefrei: lima-city


analog uhr

lima-cityForumDie eigene HomepageHTML, CSS & Javascript

  1. Autor dieses Themas

    trancedrome

    trancedrome hat kostenlosen Webspace.

    Moinsen,
    kennt jemand ne html oder java f?r ne gut aussehende Uhr (analog)?

    MfG Trancer
  2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

  3. Ich hab hier drei M?glichkeiten f?r dich:
    M?glichkeit 1:
    <SCRIPT LANGUAGE="VBScript">
    Dim a
    Dim min1
    Dim hr1
    Dim sec1

    'Initializes clock and tells it how to behave, when to start animation, etc

    Sub window_onload
    a = time
    theTimeDate.innerText = now
    sec1 = second(a)
    min1 = minute(a)
    hr1 = hour(a)
    if hr1 > 12 then
    hr1 = hr1 - 12
    end if
    call sgSecondHand.Rotate(0,0,sec1*6 - 90)
    call sgMinuteHand.Rotate(0,0,min1*6 - 90)
    call sgHourHand.Rotate(0,0,hr1*360/12 - 90)
    call sgHourHand.Rotate(0,0,int(min1/2))
    call seq("Time").Play
    end Sub


    'Sequencer initilization

    Sub Seq_OnInit
    Call seq("Time").at(1.000, "SecRot", -1,1.000, 1)
    End Sub

    'rotates second hand of clock

    Sub SecRot
    theTimeDate.innerText = now
    a = time
    sec1 = second(a)
    min1 = minute(a)
    hr1 = hour(a)
    if hr1 > 12 then
    hr1 = hr1 - 12
    end if
    Call sgSecondHand.Rotate(0,0,6)
    if sec1 = 0 then
    Call sgMinuteHand.Rotate(0,0,6)
    if min1 mod 2 = 0 then
    call sgHourHand.Rotate(0,0,1)
    end if
    end if
    End Sub

    </SCRIPT>
    <DIV ID = "MASTERLAYOUT" STYLE="POSITION:relative;WIDTH:300; HEIGHT:260;TOP:80;LEFT:50; background:#ffffff">

    <DIV STYLE="POSITION:ABSOLUTE; HEIGHT:60; WIDTH:200; TOP:230; left:50">
    <CENTER>
    <P id=theTimeDate></P>
    </CENTER>
    </DIV>

    <DIV ID="divTimeText" STYLE="POSITION:ABSOLUTE; WIDTH:202;HEIGHT:202; TOP:0; LEFT:0;z-index:2">

    <OBJECT ID="SgNumbers" CLASSID = "CLSID:369303C2-D7AC-11D0-89D5-00A0C90833E6" STYLE= "POSITION:ABSOLUTE; WIDTH:200; HEIGHT:200; TOP:10; LEFT:50;Z-INDEX:5">
    <PARAM NAME="Line0001" VALUE="SetLineColor(0, 0, 0)"> //hier den Farbcode der Zahlen angeben
    <PARAM NAME="Line0002" VALUE="SetLineStyle(1)">
    <PARAM NAME="Line0003" VALUE="SetFillStyle(1)">
    <PARAM NAME="Line0004" VALUE="SetFillColor(0,0,0)"> //hier den Farbcode der Zahlen angeben
    <PARAM NAME="Line0005" VALUE="SetFont('ARIAL',24,650,0,0,0)">
    <PARAM NAME="Line0006" VALUE="Text('.',40,-72,0">
    <PARAM NAME="Line0007" VALUE="Text('.',70,-42,0">
    <PARAM NAME="Line0008" VALUE="Text('3',80,7,0">
    <PARAM NAME="Line0009" VALUE="Text('.',70,45,0">
    <PARAM NAME="Line0010" VALUE="Text('.',40,76,0">
    <PARAM NAME="Line0011" VALUE="Text('6',-8,90,0">
    <PARAM NAME="Line0012" VALUE="Text('.',-47,76,0">
    <PARAM NAME="Line0013" VALUE="Text('.',-77,45,0">
    <PARAM NAME="Line0014" VALUE="Text('9',-92,7,0">
    <PARAM NAME="Line0015" VALUE="Text('.',-77,-42,0">
    <PARAM NAME="Line0016" VALUE="Text('.',-47,-72,0">
    <PARAM NAME="Line0017" VALUE="Text('12',-14,-76,0">
    </OBJECT>
    </div>

    <OBJECT ID="sgBackground" CLASSID = "CLSID:369303C2-D7AC-11D0-89D5-00A0C90833E6" STYLE="POSITION:absolute; TOP:10; LEFT:50; WIDTH:200; HEIGHT:200">
    <PARAM NAME="Line0001" VALUE="SetLineColor(0, 0, 0)"> //hier den Farbcode der hintergrund angeben
    <PARAM NAME="Line0001" VALUE="SetLineStyle(5)">
    <PARAM NAME="Line0002" VALUE="SetFillStyle(1)">
    <PARAM NAME="Line0003" VALUE="SetFillColor(255,255,255)">
    <PARAM NAME="Line0004" VALUE="SetGradientFill(0,0,-100,-100,0)">
    <PARAM NAME="Line0005" VALUE="Oval(-100,-100,199,199,0)">
    </OBJECT>

    <DIV ID="divClock" STYLE="POSITION:ABSOLUTE; WIDTH:200; HEIGHT:200; TOP:0; LEFT:0;">

    <OBJECT ID="sgSecondHand" CLASSID = "CLSID:369303C2-D7AC-11D0-89D5-00A0C90833E6" STYLE="POSITION:absolute; TOP:10; LEFT:50; WIDTH:200; HEIGHT:200; Z-INDEX:5">
    <PARAM NAME="Line0001" VALUE="SetLineColor(0, 0, 0)"> //hier den Farbcode der sekundenzeiger angeben
    <PARAM NAME="Line0002" VALUE="SetLineStyle(1)">
    <PARAM NAME="Line0003" VALUE="SetFillColor(0,0,0)"> //hier den Farbcode der sekundenzeiger angeben
    <PARAM NAME="Line0004" VALUE="SetFillStyle(1)">
    <PARAM NAME="Line0005" VALUE="Rect(0,0,95,0,0)">
    </OBJECT>

    <OBJECT ID="sgMinuteHand" CLASSID = "CLSID:369303C2-D7AC-11D0-89D5-00A0C90833E6" STYLE="POSITION:absolute; TOP:10; LEFT:50; WIDTH:200; HEIGHT:200; Z-INDEX:5">
    <PARAM NAME="Line0001" VALUE="SetLineColor(0, 0, 0)"> //hier den Farbcode der mintenzeiger angeben
    <PARAM NAME="Line0002" VALUE="SetLineStyle(1)">
    <PARAM NAME="Line0003" VALUE="SetFillColor(0,0,0)"> //hier den Farbcode der minutenzeiger angeben
    <PARAM NAME="Line0004" VALUE="SetFillStyle(1)">
    <PARAM NAME="Line0005" VALUE="Rect(0,-1,85,1,0)">
    </OBJECT>

    <OBJECT ID="sgHourHand" CLASSID = "CLSID:369303C2-D7AC-11D0-89D5-00A0C90833E6" STYLE="POSITION:ABSOLUTE; TOP:10; LEFT:50; WIDTH:200; HEIGHT:200; Z-INDEX:5">
    <PARAM NAME="Line0001" VALUE="SetLineColor(0, 0, 0)"> //hier den Farbcode der stundenzeiger angeben
    <PARAM NAME="Line0002" VALUE="SetLineStyle(1)">
    <PARAM NAME="Line0003" VALUE="SetFillColor(0,0,0)"> //hier den Farbcode der stundenzeiger angeben
    <PARAM NAME="Line0004" VALUE="SetFillStyle(1)">
    <PARAM NAME="Line0005" VALUE="Rect(0,-2,70,2,0)">
    </OBJECT>
    </DIV>
    </DIV>

    <OBJECT ID="Seq" CLASSID="CLSID:B0A6BAE2-AAF0-11d0-A152-00A0C908DB96">
    </OBJECT>
    <script language="JavaScript">
    <!--
    if (navigator.appName == "Microsoft Internet Explorer") {
    document.write('');
    }else{
    document.write("<font face='Arial,Helvetica,MS Sans Serif'><center>Dieses Skript l?uft nur mit dem MSIE 4.0!</center></font><br>");
    }
    // -->
    </script>



    M?glichkeit 2:
    <script language="JavaScript">
    <!-- 24/12 Hour Clock

    ClockFace=new Image();
    ClockFace.src="gfxu/uhr.gif";

    milCol='#ffffff'; //24 colour.
    civCol='#ffffff'; //12 colour.
    dotCol='#ddeefe'; //dot colour.
    hCol='#0000ff'; //hours colour.
    mCol='#0000ff'; //minutes colour.
    sCol='#ff0000'; //seconds colour.
    ampmCol='#ddeefe';//am-pm colour.

    //Alter nothing below! Alignments will be lost!
    ns=(document.layers);
    ns6=(document.getElementById&&!document.all);
    ie=(document.all);
    h=3;
    m=4;
    s=5;
    civ='1 2 3 4 5 6 7 8 9 10 11 12';
    civ=civ.split(' ');
    mil='13 14 15 16 17 18 19 20 21 22 23 24';
    mil=mil.split(' ');
    n=civ.length;
    ClockHeight=30;
    ClockWidth=30;
    f24="<font face='Arial' size=1 color="+milCol+">";
    f12="<font face='Arial' size=1 color="+civCol+">";
    e=360/n;
    HandHeight=ClockHeight/4;
    HandWidth=ClockWidth/4;
    y=0;
    x=0;
    if (!ns)
    document.write('<div id="glass" style="position:absolute"><img src='+ClockFace.src+' height=142 width=142></div>');
    else
    document.write("<layer name='glass' top=0 left=0><img src="+ClockFace.src+" height=142 width=142></layer>");
    if (!ns)
    document.write("<div id='disp' style='position:absolute;width:50px;height:20px;text-align:center'> </div>");
    else
    document.write("<layer name=disp top=0 left=0></layer>");
    for (i=0; i < n; i++){
    if (!ns)
    document.write('<div id="Mil'+i+'" style="position:absolute;width:15px;height:15px;text-align:center;color:#0000dd">'+f24+mil+'</font></div>');
    else
    document.write('<layer name="Mil'+i+'" width=15 height=15><center>'+f24+mil+'</font></center></layer>');
    }
    for (i=0; i < n; i++){
    if (!ns)
    document.write('<div id="Civ'+i+'" style="position:absolute;width:15px;height:15px;text-align:center;color:#0000dd">'+f12+civ+'</font></div>');
    else
    document.write('<layer name="Civ'+i+'" width=15 height=15><center>'+f12+civ+'</font></center></layer>');
    }
    for (i=0; i < n; i++){
    if (!ns)
    document.write('<div id="D'+i+'" style="position:absolute;width:2px;height:2px;font-size:2px;background:'+dotCol+'"></div>');
    else
    document.write('<layer name="D'+i+'" bgcolor='+dotCol+' width=2 height=2></layer>');
    }
    for (i=0; i < h; i++){
    if (!ns)
    document.write('<div id="H'+i+'" style="position:absolute;width:2px;height:2px;font-size:2px;background:'+hCol+'"></div>');
    else
    document.write('<layer name="H'+i+'" bgcolor='+hCol+' width=2 height=2></layer>');
    }
    for (i=0; i < m; i++){
    if (!ns)
    document.write('<div id="M'+i+'" style="position:absolute;width:2px;height:2px;font-size:2px;background:'+mCol+'"></div>');
    else
    document.write('<layer name="M'+i+'" bgcolor='+mCol+' width=2 height=2></layer>');
    }
    for (i=0; i < s; i++){
    if (!ns)
    document.write('<div id="S'+i+'" style="position:absolute;width:2px;height:2px;font-size:2px;background:'+sCol+'"></div>');
    else
    document.write('<layer name="S'+i+'" bgcolor='+sCol+' width=2 height=2></layer>');
    }
    function ClockAndAssign(){
    var _d=(ns||ie)?'document.':'document.getElementById("';
    var _a=(ns||ns6)?'':'all.';
    var _n6r=(ns6)?'")':'';
    var _s=(ns)?'':'.style';
    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;
    ampm=(hr>11)?"PM":"AM";
    y=(ie)?document.body.scrollTop+window.document.body.clientHeight-ClockHeight*2.4:window.pageYOffset+window.innerHeight-ClockHeight*2.4;
    x=(ie)?document.body.scrollLeft+window.document.body.clientWidth-ClockWidth*2.4:window.pageXOffset+window.innerWidth-ClockWidth*2.9;
    var Dspf=eval(_d+_a+"glass"+_n6r+_s);Dspf.top=y-71;Dspf.left=x-70;
    var Dsp=eval(_d+_a+"disp"+_n6r+_s);Dsp.top=y-17;Dsp.left=x-24;
    for (i=0; i < s; i++){var d1=eval(_d+_a+"S"+i+_n6r+_s);d1.top=y+(i*HandHeight)*Math.sin(sec);d1.left=x+(i*HandWidth)*Math.cos(sec)}
    for (i=0; i < m; i++){var d2=eval(_d+_a+"M"+i+_n6r+_s);d2.top=y+(i*HandHeight)*Math.sin(min);d2.left=x+(i*HandWidth)*Math.cos(min)}
    for (i=0; i < h; i++){var d3=eval(_d+_a+"H"+i+_n6r+_s);d3.top=y+(i*HandHeight)*Math.sin(hrs);d3.left=x+(i*HandWidth)*Math.cos(hrs)}
    for (i=0; i < n; i++){var d4=eval(_d+_a+"D"+i+_n6r+_s);d4.top=y+ ClockHeight*Math.sin(-1.0471+i*e*Math.PI/180);d4.left=x+ ClockWidth*Math.cos(-1.0471+i*e*Math.PI/180)}
    for (i=0; i < n; i++){var d5=eval(_d+_a+"Civ"+i+_n6r+_s);d5.top=y-6+ClockHeight*1.4*Math.sin(-1.0471+i*e*Math.PI/180);d5.left=x-6+ClockWidth*1.4*Math.cos(-1.0471+i*e*Math.PI/180)}
    for (i=0; i < n; i++){var d6=eval(_d+_a+"Mil"+i+_n6r+_s);d6.top=y-6+ClockHeight*1.9*Math.sin(-1.0471+i*e*Math.PI/180);d6.left=x-6+ClockWidth*1.9*Math.cos(-1.0471+i*e*Math.PI/180)}
    setTimeout('ClockAndAssign()',100);
    if (ie)disp.innerHTML='<font face=Arial size=6 color='+ampmCol+'>'+ampm+'</font>';
    if (ns){
    document.disp.document.open();
    document.disp.document.write('<font face=Arial size=6 color='+ampmCol+'>'+ampm+'</font>');
    document.disp.document.close();
    }
    }
    function aorp(){
    if (ns6)
    document.getElementById("disp").innerHTML='<font face=Arial size=6 color='+ampmCol+'>'+ampm+'</font>';
    setTimeout('aorp()',60000);
    }
    ClockAndAssign();
    if (ns6)aorp();
    //-->
    </script>



    M?glichkeit die 3.:

    <script language="JavaScript">
    <!-- Clock

    civCol='#777770'; //12 colour.
    dotCol='#777770'; //dot colour.
    hCol='#fffff0'; //hours colour.
    mCol='#fffff0'; //minutes colour.
    sCol='#00ff00'; //seconds colour.
    ampmCol='#444440';//am-pm colour.

    //Alter nothing below! Alignments will be lost!
    ns=(document.layers);
    ns6=(document.getElementById&&!document.all);
    ie=(document.all);
    h=3;
    m=4;
    s=5;
    civ='1 2 3 4 5 6 7 8 9 10 11 12';
    civ=civ.split(' ');
    n=civ.length;
    ClockHeight=30;
    ClockWidth=30;
    f12="<font face='Arial' size=1 color="+civCol+">";
    e=360/n;
    HandHeight=ClockHeight/4;
    HandWidth=ClockWidth/4;
    y=0;
    x=0;
    if (!ns)
    document.write("<div id='disp' style='position:absolute;width:50px;height:20px;text-align:center'> </div>");
    else
    document.write("<layer name=disp top=0 left=0></layer>");
    for (i=0; i < n; i++){
    if (!ns)
    document.write('<div id="Civ'+i+'" style="position:absolute;width:15px;height:15px;text-align:center;color:#0000dd">'+f12+civ+'</font></div>');
    else
    document.write('<layer name="Civ'+i+'" width=15 height=15><center>'+f12+civ+'</font></center></layer>');
    }
    for (i=0; i < n; i++){
    if (!ns)
    document.write('<div id="D'+i+'" style="position:absolute;width:2px;height:2px;font-size:2px;background:'+dotCol+'"></div>');
    else
    document.write('<layer name="D'+i+'" bgcolor='+dotCol+' width=2 height=2></layer>');
    }
    for (i=0; i < h; i++){
    if (!ns)
    document.write('<div id="H'+i+'" style="position:absolute;width:2px;height:2px;font-size:2px;background:'+hCol+'"></div>');
    else
    document.write('<layer name="H'+i+'" bgcolor='+hCol+' width=2 height=2></layer>');
    }
    for (i=0; i < m; i++){
    if (!ns)
    document.write('<div id="M'+i+'" style="position:absolute;width:2px;height:2px;font-size:2px;background:'+mCol+'"></div>');
    else
    document.write('<layer name="M'+i+'" bgcolor='+mCol+' width=2 height=2></layer>');
    }
    for (i=0; i < s; i++){
    if (!ns)
    document.write('<div id="S'+i+'" style="position:absolute;width:2px;height:2px;font-size:2px;background:'+sCol+'"></div>');
    else
    document.write('<layer name="S'+i+'" bgcolor='+sCol+' width=2 height=2></layer>');
    }
    function ClockAndAssign(){
    var _d=(ns||ie)?'document.':'document.getElementById("';
    var _a=(ns||ns6)?'':'all.';
    var _n6r=(ns6)?'")':'';
    var _s=(ns)?'':'.style';
    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;
    ampm=(hr>11)?"PM":"AM";
    y=(ie)?document.body.scrollTop+window.document.body.clientHeight-ClockHeight*2:window.pageYOffset+window.innerHeight-ClockHeight*2;
    x=(ie)?document.body.scrollLeft+window.document.body.clientWidth-ClockWidth*2:window.pageXOffset+window.innerWidth-ClockWidth*2.4;
    var Dsp=eval(_d+_a+"disp"+_n6r+_s);Dsp.top=y-17;Dsp.left=x-24;
    for (i=0; i < s; i++){var d1=eval(_d+_a+"S"+i+_n6r+_s);d1.top=y+(i*HandHeight)*Math.sin(sec);d1.left=x+(i*HandWidth)*Math.cos(sec)}
    for (i=0; i < m; i++){var d2=eval(_d+_a+"M"+i+_n6r+_s);d2.top=y+(i*HandHeight)*Math.sin(min);d2.left=x+(i*HandWidth)*Math.cos(min)}
    for (i=0; i < h; i++){var d3=eval(_d+_a+"H"+i+_n6r+_s);d3.top=y+(i*HandHeight)*Math.sin(hrs);d3.left=x+(i*HandWidth)*Math.cos(hrs)}
    for (i=0; i < n; i++){var d4=eval(_d+_a+"D"+i+_n6r+_s);d4.top=y+ ClockHeight*Math.sin(-1.0471+i*e*Math.PI/180);d4.left=x+ ClockWidth*Math.cos(-1.0471+i*e*Math.PI/180)}
    for (i=0; i < n; i++){var d5=eval(_d+_a+"Civ"+i+_n6r+_s);d5.top=y-6+ClockHeight*1.4*Math.sin(-1.0471+i*e*Math.PI/180);d5.left=x-6+ClockWidth*1.4*Math.cos(-1.0471+i*e*Math.PI/180)}
    setTimeout('ClockAndAssign()',100);
    if (ie)disp.innerHTML='<font face=Arial size=6 color='+ampmCol+'>'+ampm+'</font>';
    if (ns){
    document.disp.document.open();
    document.disp.document.write('<font face=Arial size=6 color='+ampmCol+'>'+ampm+'</font>');
    document.disp.document.close();
    }
    }
    function aorp(){
    if (ns6)
    document.getElementById("disp").innerHTML='<font face=Arial size=6 color='+ampmCol+'>'+ampm+'</font>';
    setTimeout('aorp()',60000);
    }
    ClockAndAssign();
    if (ns6)aorp();
    //-->
    </script>



    M?glichkeit 1 ist eine Analoguht, die an einer bestimmten stelle plaziert wird und da auch bleibt.

    M?glichkeit 2 und 3 sind Uhren, im Analogformat, die immer rechts unten im Fenster sind. das bedeutet, wenn man runterscrollt, das die uhr auch mit runter geht. Ich w?rd mich zwischen den beiden aber f?r M?glichkeit 2 entscheiden.

    Hoffe, das ich helfen konnte

    MfG
    Kafke
  4. Autor dieses Themas

    trancedrome

    trancedrome hat kostenlosen Webspace.

    Jo, danke...das hilft mit schon ein wenig weiter!
  5. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?

Über lima-city

Login zum Webhosting ohne Werbung!