1. I've started a massive SPAM purge, any accounts that have spammed are being removed, also for a short period new user signups are disallowed until the SPAM cleaning is finished.

World clock with unique display

Discussion in 'Java Script/AJAX' started by JavaScript, Dec 23, 2009.

Thread Status:
Not open for further replies.
  1. JavaScript

    JavaScript New Member

    Joined:
    Nov 25, 2009
    Messages:
    16
    Likes Received:
    1
    Trophy Points:
    0
    World clock script with unusual design. Cross-browser (IE4 contains additional visual effects). World clock
    [​IMG]
    Demo: JavaScript World clock with unique display

    How to setup

    Step 1: Use CSS code below for styling the script
    CSS
    Code (Text):
    <STYLE>
    .topcoverlay {
        BACKGROUND-COLOR: #ffffff; FILTER: alpha(opacity=85); HEIGHT: 240px; LEFT: 0px; POSITION: absolute; TOP: 0px; WIDTH: 1000px
    }
    .bottomcoverlay {
        BACKGROUND-COLOR: #ffffff; FILTER: alpha(opacity=85); HEIGHT: 1000px; LEFT: 0px; POSITION: absolute; TOP: 253px; WIDTH: 1000px
    }
    </STYLE>
        <!--
            This script downloaded from w w w.JavaScriptBank. com
            Come to view and download over 2000+ free javascript at w w w.JavaScriptBank. com
        -->
     
    Step 2: Place JavaScript below in your HEAD section
    JavaScript
    Code (Text):
    <SCRIPT language=JavaScript>
    <!-- Beginning of JavaScript -


    var startpos=240
    var bildhoehe=720
    var step=3
    var makepause=200
    var difference=0
    var local=1
    var timer

    function showtimelocal() {
        if (local==1) {
            var  thistime= new Date()
            var seconds=thistime.getSeconds()
            var minutes=thistime.getMinutes()
            var hours=thistime.getHours()
            if (hours>=24) {hours=hours-24}
            var secondspos=Math.floor(bildhoehe/60*seconds)
            var minutespos=Math.floor(bildhoehe/60*minutes)
            var hourspos=Math.floor(bildhoehe/60*hours)
           
            if(document.all) {
                document.all.secondsdiv.style.posTop=startpos-secondspos
                document.all.minutesdiv.style.posTop=startpos-minutespos
                document.all.hoursdiv.style.posTop=startpos-hourspos
            }
           
            if(document.layers) {
                document.secondsdiv.top=startpos-secondspos
                document.minutesdiv.top=startpos-minutespos
                document.hoursdiv.top=startpos-hourspos
            }
            var timer=setTimeout("showtimelocal()",makepause)
        }
        else {
            clearTimeout(timer)
        }
    }

    function preUTC(thisdifference) {
        clearTimeout(timer)
        difference=eval(thisdifference)
        local=0
        showtimeUTC()
    }

    function inititate() {
        if (document.layers) {
            document.markernetscape1.visibility="VISIBLE"
            document.markernetscape2.visibility="VISIBLE"
        }
        showtimelocal()
    }

    function prelocal() {
        if (document.layers) {document.markernetscape.visibility="VISIBLE"}
        clearTimeout(timer)
        local=1
        showtimelocal()
    }

    function showtimeUTC() {
        if (local==0) {
            var  thistime= new Date()
            var seconds=thistime.getSeconds()
            var minutes=thistime.getMinutes()
            var hours=thistime.getUTCHours()
            hours+=difference
            if (hours>=24) {hours=hours-24}
            var secondspos=Math.floor(bildhoehe/60*seconds)
            var minutespos=Math.floor(bildhoehe/60*minutes)
            var hourspos=Math.floor(bildhoehe/60*hours)
           
            if(document.all) {
                document.all.secondsdiv.style.posTop=startpos-secondspos
                document.all.minutesdiv.style.posTop=startpos-minutespos
                document.all.hoursdiv.style.posTop=startpos-hourspos
            }
           
            if(document.layers) {
                document.secondsdiv.top=startpos-secondspos
                document.minutesdiv.top=startpos-minutespos
                document.hoursdiv.top=startpos-hourspos
            }
            var timer=setTimeout("showtimeUTC()",makepause)
        }
        else {
            clearTimeout(timer)
        }
    }

    window.onload=inititate
    // - End of JavaScript - -->
    </SCRIPT>
        <!--
            This script downloaded from w w w.JavaScriptBank. com
            Come to view and download over 2000+ free javascript at w w w.JavaScriptBank. com
        -->
     
    Step 3: Place HTML below in your BODY section
    HTML
    Code (Text):
    <DIV id=secondsdiv style="LEFT: 200px; POSITION: absolute; TOP: 240px">
      <IMG
    src="rotaclock2930.gif" width="14" height="720"></DIV>
    <DIV id=minutesdiv style="LEFT: 180px; POSITION: absolute">
      <IMG
    src="rotaclock2930.gif" width="14" height="720"></DIV>
    <DIV id=hoursdiv style="LEFT: 160px; POSITION: absolute; TOP: 240px">
      <IMG
    src="rotaclock2930.gif" width="14" height="720"></DIV>
    <DIV class=topcoverlay id=topcover></DIV>
    <DIV class=bottomcoverlay id=bottomcover></DIV>
    <DIV id=limiter1
    style="COLOR: #ff0000; FONT-FAMILY: Arial; FONT-SIZE: 8pt; FONT-WEIGHT: bold; LEFT: 176px; POSITION: absolute; TOP: 241px">
        :</DIV>
    <DIV id=limiter2
    style="COLOR: #ff0000; FONT-FAMILY: Arial; FONT-SIZE: 8pt; FONT-WEIGHT: bold; LEFT: 196px; POSITION: absolute; TOP: 241px">
        :</DIV>
    <DIV id=markernetscape1
    style="COLOR: #ff0000; FONT-FAMILY: Arial; FONT-SIZE: 12pt; FONT-WEIGHT: bold; LEFT: 122px; POSITION: absolute; TOP: 248px; VISIBILITY: hidden"><IMG
    height=1 src="line2930.gif" width=20></DIV>
    <DIV id=markernetscape2
    style="COLOR: #ff0000; FONT-FAMILY: Arial; FONT-SIZE: 12pt; FONT-WEIGHT: bold; LEFT: 230px; POSITION: absolute; TOP: 248px; VISIBILITY: hidden"><IMG
    height=1 src="js 46_files/line2930.gif" width=20></DIV>
    <DIV id=timezones
    style="COLOR: #ff0000; FONT-FAMILY: Arial; FONT-SIZE: 8pt; LEFT: 10px; POSITION: absolute; TOP: 5px"><A
    href="#"
    onmouseover=prelocal()>&gt;&gt; local time</A><BR><A
    href="#"
    onmouseover="preUTC('-8')">Anchorage</A><BR><A
    href="#"
    onmouseover="preUTC('-11')">Auckland</A><BR><A
    href="#"
    onmouseover="preUTC('3')">Baghdad</A><BR><A
    href="#"
    onmouseover="preUTC('8')">Bejing</A><BR><A
    href="#"
    onmouseover="preUTC('-3')">Buenos Aires</A><BR><A
    href="#"
    onmouseover="preUTC('-6')">Denver</A><BR><A
    href="#"
    onmouseover="preUTC('8')">Hongkong</A><BR><A
    href="#"
    onmouseover="preUTC('-9')">Honolulu</A><BR><A
    href="#"
    onmouseover="preUTC('8')">Jakarta</A><BR><A
    href="#"
    onmouseover="preUTC('2')">Johannesburg</A><BR><A
    href="#"
    onmouseover="preUTC('2')">Kairo</A><BR><A
    href="#"
    onmouseover="preUTC('-5')">Lima</A><BR><A
    href="#"
    onmouseover="preUTC('1')">London</A><BR><A
    href="#"
    onmouseover="preUTC('-7')">Los Angeles</A><BR><A
    href="#"
    onmouseover="preUTC('4')">Moscow</A><BR><A
    href="#"
    onmouseover="preUTC('3')">Nairobi</A><BR><A
    href="#"
    onmouseover="preUTC('-4')">New York</A><BR><A
    href="#"
    onmouseover="preUTC('2')">Paris</A><BR><A
    href="#"
    onmouseover="preUTC('-2')">Rio</A><BR><A
    href="#"
    onmouseover="preUTC('10')">Sydney</A><BR><A
    href="#"
    onmouseover="preUTC('9')">Tokyo</A><BR></DIV>
        <!--
            This script downloaded from w w w.JavaScriptBank. com
            Come to view and download over 2000+ free javascript at w w w.JavaScriptBank. com
        -->
     
    Step 4: downloads
    Files
    rotaclock2930.gif






    JavaScript Enlarge Image - JavaScript Fading Slide Show - JavaScript Rotating Image script​
    Loading...
Thread Status:
Not open for further replies.

Share This Page