Page 1 of 2 12 LastLast
Results 1 to 10 of 13

Thread: Live clock?

  1. #1
    Join Date
    Feb 2007
    Location
    🌎
    Posts
    528
    Thanks
    10
    Thanked 10 Times in 10 Posts
    Blog Entries
    2

    Exclamation Live clock?

    I really need an answer to this before Thursday.
    What is the refresh function in JavaScript that makes a live clock live?
    How can I make this script clock appear as live (I know, I know, please ignore the poor formatting and methods for now.):
    Code:
    var today = new Date();
    var month = today.getMonth();
    var displayMonth;
    var hours = today.getHours();
    var minutes = today.getMinutes();
    var ap;
    var displayHours;
    var displayMinutes;
    var displaySeconds;
    var seconds = today.getSeconds();
    var year = today.getFullYear();
    var milli = today.getMilliseconds();
    var displayMilli;
    var date = today.getDate();
    var day = today.getDay();
    var displayDay;
    
    switch (month) {
    	case 0 :
    		displayMonth = "January"
    		break
    	case 1 :
    		displayMonth = "February"
    		break
    	case 2 :
    		displayMonth = "March"
    		break
    	case 3 :
    		displayMonth = "April"
    		break
    	case 4 :
    		displayMonth = "May"
    		break
    	case 5 :
    		displayMonth = "June"
    		break
    	case 6 :
    		displayMonth = "July"
    		break
    	case 7 :
    		displayMonth = "August"
    		break
    	case 8 :
    		displayMonth = "September"
    		break
    	case 9 :
    		displayMonth = "October"
    		break
    	case 10 :
    		displayMonth = "November"
    		break
    	case 11 :
    		displayMonth = "December"
    		break
    		
    	default: displayMonth = ""
    
    }
    
    switch (day) {
    	case 0 :
    		displayDay = "Sunday"
    		break
    	case 1 :
    		displayDay = "Monday"
    		break
    	case 2 :
    		displayDay = "Tuesday"
    		break
    	case 3 :
    		displayDay = "Wednesday"
    		break
    	case 4 :
    		displayDay = "Thursday"
    		break
    	case 5 :
    		displayDay = "Friday"
    		break
    	case 6 :
    		displayDay = "Saturday"
    		break
    	
    	default: displayDay = ""
    }
    	
    if (hours <= 11 && hours != 0) {
    	displayHours = hours;
    	ap = "AM";
    }
    if (hours == 0) {
    	displayHours = 12;
    	ap = "AM";
    }
    if (hours == 12) {
    	displayHours = hours;
    	ap = "PM";
    }
    if (hours > 12) {
    	displayHours = hours - 12;
    	ap = "PM";
    }
    
    if (minutes < 10) {
    	displayMinutes = "0" + minutes;
    }
    else {
    	displayMinutes = minutes;
    }
    
    if (seconds < 10) {
    	displaySeconds = "0" + seconds;
    }
    else {
    	displaySeconds = seconds;
    }
    
    if (milli < 10) {
    	displayMilli = "00" + milli;
    }
    if (milli > 10 && milli < 100) {
    	displayMilli = "0" + milli;
    }
    else {
    	displayMilli = milli;
    }
    
    var timestart = '<div class="date">'
    var timend = '</div>'
    var display = timestart + displayDay + ", " + displayMonth + " " + date + ", " + year + " " + displayHours + ":" + displayMinutes + ":" + displaySeconds + "." + displayMilli;
    document.write(display);
    ....(o_ Penguins
    .---/(o_- techno_racing
    +(---//\-' in
    .+(_)--(_)' The McMurdo 500

  2. #2
    Join Date
    Jan 2008
    Posts
    4,168
    Thanks
    28
    Thanked 628 Times in 624 Posts
    Blog Entries
    1

    Default

    Try this:
    Code:
    function datef(){
    setTimeout('datef()',100);
    var today = new Date();
    var month = today.getMonth();
    var displayMonth;
    var hours = today.getHours();
    var minutes = today.getMinutes();
    var ap;
    var displayHours;
    var displayMinutes;
    var displaySeconds;
    var seconds = today.getSeconds();
    var year = today.getFullYear();
    var milli = today.getMilliseconds();
    var displayMilli;
    var date = today.getDate();
    var day = today.getDay();
    var displayDay;
    
    switch (month) {
    	case 0 :
    		displayMonth = "January"
    		break
    	case 1 :
    		displayMonth = "February"
    		break
    	case 2 :
    		displayMonth = "March"
    		break
    	case 3 :
    		displayMonth = "April"
    		break
    	case 4 :
    		displayMonth = "May"
    		break
    	case 5 :
    		displayMonth = "June"
    		break
    	case 6 :
    		displayMonth = "July"
    		break
    	case 7 :
    		displayMonth = "August"
    		break
    	case 8 :
    		displayMonth = "September"
    		break
    	case 9 :
    		displayMonth = "October"
    		break
    	case 10 :
    		displayMonth = "November"
    		break
    	case 11 :
    		displayMonth = "December"
    		break
    		
    	default: displayMonth = ""
    
    }
    
    switch (day) {
    	case 0 :
    		displayDay = "Sunday"
    		break
    	case 1 :
    		displayDay = "Monday"
    		break
    	case 2 :
    		displayDay = "Tuesday"
    		break
    	case 3 :
    		displayDay = "Wednesday"
    		break
    	case 4 :
    		displayDay = "Thursday"
    		break
    	case 5 :
    		displayDay = "Friday"
    		break
    	case 6 :
    		displayDay = "Saturday"
    		break
    	
    	default: displayDay = ""
    }
    	
    if (hours <= 11 && hours != 0) {
    	displayHours = hours;
    	ap = "AM";
    }
    if (hours == 0) {
    	displayHours = 12;
    	ap = "AM";
    }
    if (hours == 12) {
    	displayHours = hours;
    	ap = "PM";
    }
    if (hours > 12) {
    	displayHours = hours - 12;
    	ap = "PM";
    }
    
    if (minutes < 10) {
    	displayMinutes = "0" + minutes;
    }
    else {
    	displayMinutes = minutes;
    }
    
    if (seconds < 10) {
    	displaySeconds = "0" + seconds;
    }
    else {
    	displaySeconds = seconds;
    }
    
    if (milli < 10) {
    	displayMilli = "00" + milli;
    }
    if (milli > 10 && milli < 100) {
    	displayMilli = "0" + milli;
    }
    else {
    	displayMilli = milli;
    }
    
    var timestart = '<div class="date">'
    var timend = '</div>'
    var display = timestart + displayDay + ", " + displayMonth + " " + date + ", " + year + " " + displayHours + ":" + displayMinutes + ":" + displaySeconds + "." + displayMilli;
    document.write(display);
    }
    Then add:
    Code:
    onLoad="datef()"
    To your body section.
    Jeremy | jfein.net

  3. #3
    Join Date
    Feb 2007
    Location
    🌎
    Posts
    528
    Thanks
    10
    Thanked 10 Times in 10 Posts
    Blog Entries
    2

    Default

    That didn't work...and wiped out the rest of my page.
    ....(o_ Penguins
    .---/(o_- techno_racing
    +(---//\-' in
    .+(_)--(_)' The McMurdo 500

  4. #4
    Join Date
    Jan 2008
    Posts
    4,168
    Thanks
    28
    Thanked 628 Times in 624 Posts
    Blog Entries
    1

    Default

    Try switching:
    Code:
    setTimeout('datef()',100);
    To:
    Code:
    setTimeout(datef(),100);
    If this doesn't work, search google for the setTimeout function.
    Im not the best with this function.
    Jeremy | jfein.net

  5. #5
    Join Date
    Feb 2007
    Location
    🌎
    Posts
    528
    Thanks
    10
    Thanked 10 Times in 10 Posts
    Blog Entries
    2

    Default

    Stack overflow at line 3.
    Last edited by techno_race; 03-26-2008 at 01:56 AM. Reason: overview?
    ....(o_ Penguins
    .---/(o_- techno_racing
    +(---//\-' in
    .+(_)--(_)' The McMurdo 500

  6. #6
    Join Date
    Jan 2008
    Posts
    4,168
    Thanks
    28
    Thanked 628 Times in 624 Posts
    Blog Entries
    1

    Default

    Jeremy | jfein.net

  7. #7
    Join Date
    Feb 2007
    Location
    🌎
    Posts
    528
    Thanks
    10
    Thanked 10 Times in 10 Posts
    Blog Entries
    2

    Default

    I already tried that.
    ....(o_ Penguins
    .---/(o_- techno_racing
    +(---//\-' in
    .+(_)--(_)' The McMurdo 500

  8. #8
    Join Date
    Feb 2008
    Location
    Cebu City Philippines
    Posts
    1,160
    Thanks
    17
    Thanked 277 Times in 275 Posts

    Default

    There is a dynamic clock here

    Haven't you tried adding a meta refresh on your page?..
    Learn how to code at 02geek

    The more you learn, the more you'll realize there's much more to learn
    Ray.ph!

  9. #9
    Join Date
    Sep 2005
    Location
    India
    Posts
    1,627
    Thanks
    6
    Thanked 107 Times in 107 Posts

    Default

    Hello Techno_race,

    Here is your live clock code which is working as it supposed. I've highlighted the section on which I've made the changes. Wrapped your code inside a function for easiness.

    Code:
    <?xml version="1.0" encoding="UTF-8"?>
     <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
        <head>
            <title></title>
            <style type="text/css">
            </style>
            <script type="text/javascript">
                var timeDisplay = function(){
                    var today = new Date();
                    var month = today.getMonth();
                    var displayMonth;
                    var hours = today.getHours();
                    var minutes = today.getMinutes();
                    var ap;
                    var displayHours;
                    var displayMinutes;
                    var displaySeconds;
                    var seconds = today.getSeconds();
                    var year = today.getFullYear();
                    var milli = today.getMilliseconds();
                    var displayMilli;
                    var date = today.getDate();
                    var day = today.getDay();
                    var displayDay;
                    
                    switch (month) {
                        case 0:
                            displayMonth = "January"
                            break
                        case 1:
                            displayMonth = "February"
                            break
                        case 2:
                            displayMonth = "March"
                            break
                        case 3:
                            displayMonth = "April"
                            break
                        case 4:
                            displayMonth = "May"
                            break
                        case 5:
                            displayMonth = "June"
                            break
                        case 6:
                            displayMonth = "July"
                            break
                        case 7:
                            displayMonth = "August"
                            break
                        case 8:
                            displayMonth = "September"
                            break
                        case 9:
                            displayMonth = "October"
                            break
                        case 10:
                            displayMonth = "November"
                            break
                        case 11:
                            displayMonth = "December"
                            break
                        default:
                            displayMonth = ""
                            
                    }
                    
                    switch (day) {
                        case 0:
                            displayDay = "Sunday"
                            break
                        case 1:
                            displayDay = "Monday"
                            break
                        case 2:
                            displayDay = "Tuesday"
                            break
                        case 3:
                            displayDay = "Wednesday"
                            break
                        case 4:
                            displayDay = "Thursday"
                            break
                        case 5:
                            displayDay = "Friday"
                            break
                        case 6:
                            displayDay = "Saturday"
                            break
                        default:
                            displayDay = ""
                    }
                    
                    if (hours <= 11 && hours != 0) {
                        displayHours = hours;
                        ap = "AM";
                    }
                    if (hours == 0) {
                        displayHours = 12;
                        ap = "AM";
                    }
                    if (hours == 12) {
                        displayHours = hours;
                        ap = "PM";
                    }
                    if (hours > 12) {
                        displayHours = hours - 12;
                        ap = "PM";
                    }
                    
                    if (minutes < 10) {
                        displayMinutes = "0" + minutes;
                    }
                    else {
                        displayMinutes = minutes;
                    }
                    
                    if (seconds < 10) {
                        displaySeconds = "0" + seconds;
                    }
                    else {
                        displaySeconds = seconds;
                    }
                    
                    if (milli < 10) {
                        displayMilli = "00" + milli;
                    }
                    if (milli > 10 && milli < 100) {
                        displayMilli = "0" + milli;
                    }
                    else {
                        displayMilli = milli;
                    }
                    
                    var timestart = '<div id="date">'
                    var timend = '</div>'
                    var display = timestart + displayDay + ", " + displayMonth + " " + date + ", " + year + " " + displayHours + ":" + displayMinutes + ":" + displaySeconds + "." + displayMilli + timend;
                    
                    if (document.getElementById('date')) 
                        document.getElementById('date').innerHTML = displayDay + ", " + displayMonth + " " + date + ", " + year + " " + displayHours + ":" + displayMinutes + ":" + displaySeconds + "." + displayMilli;
                    else 
                        document.write(display);
                    setTimeout('timeDisplay()', 1000);
                }
                
                timeDisplay();
            </script>
        </head>
        <body>
            <div>
                This is another div 
            </div>
        </body>
    </html>

  10. The Following User Says Thank You to codeexploiter For This Useful Post:

    techno_race (03-27-2008)

  11. #10
    Join Date
    Feb 2007
    Location
    🌎
    Posts
    528
    Thanks
    10
    Thanked 10 Times in 10 Posts
    Blog Entries
    2

    Default

    Quote Originally Posted by rangana View Post
    There is a dynamic clock here

    Haven't you tried adding a meta refresh on your page?..
    For 1 millisecond? Yeah, right. If this page is on a server, it wouldn't be able to load before it refreshed next.
    ....(o_ Penguins
    .---/(o_- techno_racing
    +(---//\-' in
    .+(_)--(_)' The McMurdo 500

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •