zoukankan      html  css  js  c++  java
  • 标题栏显示分时问候语js

    效果图如下:

    代码如下:

    <script>
            var now = new Date();
            var hour = now.getHours();
            if(hour < 6) {
                document.title="早上好!";
            }else if(hour < 9) {
                document.title="早上好!";
            }else if(hour < 12) {
                document.title="上午好!";
            }else if(hour < 14) {
                document.title="中午好!";
            }else if(hour < 17) {
                document.title="下午好!";
            }else if(hour < 19) {
                document.title="傍晚好!";
            }else if (hour < 22) {
                document.title="晚上好!";
            }else{
                document.title="夜里好!";
            }
        </script>

    原理:

    先定义个时间变量,然后通过判断时间去显示标题的内容。

     如果想让标题走马灯效果,使用.substring()函数就行

    代码如下:

        <script>
            var position = 0;
        
            var now = new Date();
            var hour = now.getHours();
            if(hour < 6) {
                msg="早上好!";
            }else if(hour < 9) {
                msg="早上好!";
            }else if(hour < 12) {
                msg="上午好!";
            }else if(hour < 14) {
                msg="中午好!";
            }else if(hour < 17) {
                msg="下午好!";
            }else if(hour < 19) {
                msg="傍晚好!";
            }else if (hour < 22) {
                msg="晚上好!";
            }else{
                msg="夜里好!";
            }
            var position = 0;
            function shijian(){
            // document.querySelector('p').innerHTML=msg.substring(position,position+100);
            document.title = msg.substring(position,position+100);
    
            if (position--==0) {
                position = msg.length;
            }
            setTimeout("shijian()",200);
        }
        shijian();

    原理:把判断的结果赋予个变量,然后通过.substring()函数进行截取,再然后进行判断即可。

    添加部分:

    var position = 0;
            function shijian(){
            // document.querySelector('p').innerHTML=msg.substring(position,position+100);
            document.title = msg.substring(position,position+100);
    
            if (position--==0) {
                position = msg.length;
            }
            setTimeout("shijian()",200);
            }
        shijian();

    如果将

     if (position--==0) {
                position = msg.length;
            }
    换成

    if (position++==msg.length) { position = 0; }
    就是整体往左移动。



    显示打字效果就添加如下代码:

    var pos = 0;
            var l = msg.length;
            function textticker(){
                document.title = msg.substring(0,pos)+"_";
                if (pos++==l) {
                    pos=0;
                    setTimeout("textticker()",400);
                }else{
                    setTimeout("textticker()",200);
                }
            }
            textticker();

    原理一样,都是通过一个字符一个字符的蹦……

  • 相关阅读:
    dfs介绍
    UVA11149 矩阵快速幂
    UVA1476 三分法
    漂亮的表达式!(不断补充)
    BC Round#33 B(10的18次方,快速乘法+快速幂取余)
    UVA 1639(组合数学)
    UVA 10612(数论找规律)
    小模板
    1589象棋(大模拟)
    bnuoj 29368 Check the Identity(栈)
  • 原文地址:https://www.cnblogs.com/yinwangyizhi/p/9469362.html
Copyright © 2011-2022 走看看