最近在仿一个Typecho的主题，有个顶部的消息提示框，觉得不错，这里分享一下。

jQuery Notify bar 是一款仿 Twitter 的简洁的页面顶部消息提示栏插件。通过该插件你可以在页面中显示各种类型的消息提示栏。也可以通过参数来自定义消息提示栏的背景和颜色等。

使用方法：

使用该消息提示栏插件需要在页面中引入 jquery.notifyBar.css 和 jquery，以及 jquery.notifyBar.js 文件。

<link rel="stylesheet" href="css/jquery.notifyBar.css">
<script src="js/jquery.min.js"></script>
<script src="js/jquery.notifyBar.js"></script>

初始化插件：

在页面 DOM 元素加载完毕之后，可以通过下面的方法来初始化一个消息提示栏组件。

jQuery(function () {
  jQuery.notifyBar({
    HTML: "这里是消息提示栏的提示消息！",
    delay: 2000,
    animationSpeed: "normal"
  });  
});

你也可以将消息提示栏的位置设置在页面的底部。

jQuery(function () {
  jQuery.notifyBar({
    html: "Hi from below!",
    cssClass: "Appear at bottom",
    position: "bottom"
  });
});

下载地址：

该消息提示栏插件的 github 地址为：https://github.com/dknight/jQuery-Notify-bar

本文属原创，转载请注明原文：https://pangsuan.com/p/Twitter-notifyBar.html