jquery页面上滚动循环显示控制台消息插件

所属分类: 网页特效-UI滚动    2023-08-30 09:59:06

jquery页面上滚动循环显示控制台消息插件 ie兼容6
 查看演示  登录后下载 温馨提示
登录会员即可享受免费下载
 我要建站

jquery页面上滚动循环显示控制台消息插件(共6个文件)

    • main.css
    • index.html

使用方法

        $(document).ready(function () {
            // Init the consoles
            let con1 = $(".console1").console({ msgDirection: "up" });
            let con2 = $(".console2").console({ history: 15 });
            let con3 = $(".console3").console({ msgDirection: "up", showTimestamp: false, timeout: 3000 });
            let con4 = $(".console4").console({ tagOddEven: true, timestampOnLeft: true });

            // Sample messages to show off the different log levels
            let long_txt = "This is very long alert message. This is very long alert message. This is very long alert message. "
                + "This is very long alert message. This is very long alert message. This is very long alert message. "
                + "This is very long alert message. This is very long alert message. This is very long alert message.";
            let msgs = [
                { txt: "This is a debug message.", level: 7 },
                { txt: "This is an info message.", level: 6 },
                { txt: "This is a notice message.", level: 5 },
                { txt: "This is a warning message.", level: "warning" },    // can use choose using str or int
                { txt: "This is an error message.", level: 3 },
                { txt: "This is a critical message.", level: 2 },
                { txt: "This is an alert message.", level: 1 },
                { txt: "This is an emergency message.", level: 0 },
                { txt: "This is a default message." },                      // no level needs to be provided
                { txt: long_txt, level: 1 }
            ];

            // Generator implementation of writing a message every second from the message array
            function* get_message() {
                let index = 0;
                while (true) {
                    let msg = msgs[index];
                    index = (index + 1) % msgs.length;  // inc index but cycle back to the start if at the end of the list
                    yield msg;
                }
            }
            let msg_generator = get_message();
            
            function writeMessage() {
                let msg = msg_generator.next().value;
                if ("level" in msg) {
                    con1.log(msg["txt"], msg["level"]);
                    con2.log(msg["txt"], msg["level"]);
                    con3.log(msg["txt"], msg["level"]);
                    con4.log(msg["txt"], msg["level"]);
                }
                else {
                    con1.log(msg["txt"]);
                    con2.log(msg["txt"]);
                    con3.log(msg["txt"]);
                    con4.log(msg["txt"]);
                }
            }
            let tid = setInterval(writeMessage, 500);
        });

站长提示:
1. 苦力吧素材官方QQ群:950875342
2. 平台上所有素材资源,需注册登录会员方能正常下载。
3. 会员用户积极反馈网站、素材资源BUG或错误问题,每次奖励2K币
4. PHP源码类素材,如需协助安装调试,或你有二次开发需求,可联系苦力吧客服。
5. 付费素材资源,需充值后方能下载,如有任何疑问可直接联系苦力吧客服
相关资源 / UI滚动

纯CSS实现的水平文本文字新闻列表滚动条特效

一个水平新闻滚动条动画效果。新闻滚动条显示从右向左滚动的新闻列表,鼠标悬停于列表标题文字上即可暂停滚动。
  UI滚动
 7320  0

jquery swiper可触摸滑动发展历程时间轴

一款水平历史时间轴滑块特效,基于swiper实现的横向时间轴,支持手机移动端触屏左右滑动。
  UI滚动
 151  0

jquery简单实用的网站公告文字上下滚动效果

网站公告标题自动向上滚动特效,很实用的脚本特效!
  UI滚动
 6236  0

jquery页面元素滚动视差动画特效

一款网页中滚动动画插件,当鼠标向下滚动网页时,触发对背景图片和元素区块产生动画特效。。
  UI滚动
 7230  0

评论数(0) 回复有机会获得K币 用户协议

^_^ 还没有人评论,快来抢个沙发!
😀
  • 😀
  • 😊
  • 😂
  • 😍
  • 😑
  • 😷
  • 😵
  • 😛
  • 😣
  • 😱
  • 😋
  • 😎
  • 😵
  • 😕
  • 😶
  • 😚
  • 😜
  • 😭
发表评论