消息提示【message.js】和页面文字滚动【】

最新推荐文章于 2024-05-11 10:05:08 发布

赤焰梦

最新推荐文章于 2024-05-11 10:05:08 发布

阅读量282

点赞数

分类专栏： HTML/CSS/Javascript 文章标签： javascript 前端开发语言

本文链接：https://blog.csdn.net/m0_49442965/article/details/128596120

版权

HTML/CSS/Javascript 专栏收录该内容

58 篇文章 3 订阅

订阅专栏

在这里插入图片描述
到一定时间进行消息提示：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>不同时间段显示不同问候语 </title>
</head>
<script src="message.js"></script>
<script src="message.min.js"></script>
<link rel="stylesheet" href="message.css">
<body>
    
</body>
<script>
        window.QMSG_GLOBALS = {
    DEFAULTS:{
        showClose:true,
        timeout:5000
    }
}
var configs = {};


   day=new Date();
   time=day.getHours();
   if((time>=0)&&(time<7)){
         Qmsg.info("夜猫子，该休息了",configs);

   }
   if((time>=7)&&(time<12)){
    Qmsg.info("阳光灿烂，多出去晒晒太阳",configs);

 
   }
   if((time>=12)&&(time<14)){
    Qmsg.info("午休时间，注意休息",configs);


   }
   if((time>=14)&&(time<18)){

    Qmsg.info("下午工作愉快",configs);

   }
   if((time>=18)&&(time<22)){
    Qmsg.info("少玩会，注意要休息了",configs);

   }
   if((time>=22)&&(time<24)){
    Qmsg.info("该休息了",configs);

    text="该休息了";
   }

</script>
</html>

在这里插入图片描述
文字在页面中滚动:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>页面滚动</title>
</head>
<style>
    marquee{
        font-size: 20px;
        color:yellow;
        position: absolute;
        top: 30px;
        font-family:"楷体";
    }
</style>
<body>
    <!-- <marquee>这是一段文字</marquee> -->
    <!-- <marquee behavior="alternate">我来回滚动,碰壁反弹</marquee> -->
    <!-- <marquee behavior="scroll">我单方向循环滚动</marquee> -->
    <!-- <marquee behavior="scroll" direction="up" height="30">我改单方向向上循环滚动</marquee> -->
    <!-- <marquee behavior="slide">我只滚动一次</marquee> -->
    <!-- <marquee behavior="slide" direction="up">我改向上只滚动一次了</marquee>  -->
   
    <!-- <marquee behavior=="slide" direction="left" bgcolor="red">我的背景色是红色的</marquee> -->
    
    <!-- <marquee direction="right">我向右滚动</marquee> -->
    <!-- <marquee direction="down">我向下滚动</marquee> -->
    <!-- <marquee direction="up">我向上滚动</marquee> -->
    <!-- <marquee direction="left">我向左滚动</marquee> -->

    <!-- <marquee width="300" height="30" bgcolor="red">我宽300像素，高30像素。</marquee> -->
    <!-- hspace和vspace属性
这两个属性决定滚动矩形区域距周围的空白区域. -->
    <!-- <marquee width="300" height="30" vspace="10" hspace="10" bgcolor="red">我矩形边缘水平和垂直距周围各10像素。</marquee> -->
    <!-- <marquee width="300" height="30" vspace="50" hspace="50" bgcolor="red">我矩形边缘水平和垂直距周围各50像素。</marquee> -->

    <!-- loop属性
loop属性决定滚动文字的滚动次数，缺省是无限循环。参数值可以是任意的正整数，如果设置参数值为-1或infinite时将无限循环。如下所示: -->
    <!-- <marquee loop="2">我滚动2次。</marquee> -->
    <!-- <marquee loop="infinite">我无限循环滚动。</marquee> -->
    <!-- <marquee loop="-1">我无限循环滚动。</marquee> -->

    <!-- scrollamount和scrolldelay属性
这两个属性决定文字滚动的速度(scrollamount)和延时(scrolldelay)，参数值都是正整数。如下所示: -->
    <!-- <marquee scrollamount="100">我速度很快.</marquee> -->
    <!-- <marquee scrollamount="50">我慢了些。</marquee> -->
    <!-- <marquee scrolldelay="30">我小步前进。</marquee> -->
    <marquee scrolldelay="1000" scrollamount="100">我大步前进。</marquee>
</body>
</html>