Last article we learned how to limit the time of viewing the web page, which was very easy. following it, we will learn more about some special effect about web page time. You may have an email in gmail.com or hotmail.com etc. When you login, you will see the time and different messages in different time. For example, the mailbox show “hello, it’s the time to lunch” at noon and “time to sleep” at night. But do you know how to achieve this effect? It’s very easy by using script codes. Firstly we need to create a Date object, and then make a judge to time. At last we put out different messages by document. Now let us learn it step by step.
 |
Step1
Open your web page. The original web page is like this:
 |
Step2
Put the following codes into the section between <body> and </body>.
 |
- <script language="javaScript">
- < !–
- now = new Date(),hour = now.getHours()
- if(hour < 6){document.write("good morning!")}
- else if (hour < 9){document.write("time to breakfast !")}
- else if (hour < 12){document.write("time to lunch!")}
- else if (hour < 14){document.write("good noon!")}
- else if (hour < 17){document.write("good afternoon!")}
- else if (hour < 19){document.write("time to supper!")}
- else if (hour < 22){document.write("good night!")}
- else {document.write("late at night!")}
- // –>
- </script>
There are some details to pay attention. New. Date is used to create a new time example. getYear means that the time will get back to the year, and the same with getMonth, getDate, getDay, getHours, getMinutes, and getSeconds. But pay attention to getTime. It means to get back to millisecond. And setYear means to set the year. Others are the same. Document.write is used to put out the message like “good noon”. You also can change them into other messages.
Step3
After put the codes into pages, you may find the size and color of the message not beautiful. To solve this problem, you can set focus on the right position, setting the size and color in the properties inspector. You also can definite it in the code design view.
 |
Step4
Save the document. Press F12 to preview it in the internet explorer. Like the following picture showing:
 |
My time is thirteen now. You can see the “good noon!” in the page.
OK, you now have learned how to show different messages in different time. next we will learn more about the HTML codes.
[...] previous articles, we have learn that how to limit the time of viewing the web page and show different message in different time and make the web page roll automatically. These special effects use date function, stroller function. Now we learn how to forbid the page to [...]