1. 程式人生 > >JS 實現瀏覽器標題欄閃動提示訊息

JS 實現瀏覽器標題欄閃動提示訊息

<!doctype html>
<html>
<head>
    <meta charset='utf-8'>
    <title></title>
    <style></style>
</head>
<body>

<script type="text/javascript" language="javascript">
    var flashTitlePlayer = {
        start: function (msg) {
            this.title = document.title;
            if (!this.action) {
                try {
                    this.element = document.getElementsByTagName('title')[0];
                    this.element.innerHTML = this.title;
                    this.action = function (ttl) {
                        this.element.innerHTML = ttl;
                    };
                } catch (e) {
                    this.action = function (ttl) {
                        document.title = ttl;
                    }
                    delete this.element;
                }
                this.toggleTitle = function () {
                    this.action('【' + this.messages[this.index = this.index == 0 ? 1 : 0] + '】歡迎訪問簡明現代魔法');
                };
            }
            this.messages = [msg];
            var n = msg.length;
            var s = '';
            if (this.element) {
                var num = msg.match(/\w/g);
                if (num != null) {
                    var n2 = num.length;
                    n -= n2;
                    while (n2 > 0) {
                        s += " ";
                        n2--;
                    }
                }
            }
            while (n > 0) {
                s += ' ';
                n--;
            };
            this.messages.push(s);
            this.index = 0;
            this.timer = setInterval(function () {
                flashTitlePlayer.toggleTitle();
            }, 1000);
        },
        stop: function () {
            if (this.timer) {
                clearInterval(this.timer);
                this.action(this.title);
                delete this.timer;
                delete this.messages;
            }
        }
    };
    function flashTitle(msg) {
        flashTitlePlayer.start(msg);
    }
    function stopFlash() {
        flashTitlePlayer.stop();
    }
</script>

<input type='button' value='開始閃動' class='btn_1' onclick="flashTitle('您有5條訊息')" />
<input type='button' value='停止閃動' class='btn_1' onclick="stopFlash()" />

</body>
</html>