便捷提醒小插件之gritter

js原生alert弹窗可能总是达不到我们自己想要的要求，于是我就在网上搜罗一些更加美观且实用的弹窗提醒插件，发现gritter是一个比较不错的js插件，而且在使用和定义起来也都相当便捷，能达到简洁明了且美观的要求。下面简单的介绍一下gritter插件的使用方法，首先展示示例，我们可以看到这款插件的提醒背景是半透明的，而且也不会出现类似alert弹出之后用户在其他区域无法点击情况。

这是我在我自己的项目中使用的实例，提示框提示出现后几秒钟会自动消失

接下来就是插件的使用了，首先引入gritter插件的js和css文件，这也是必须的，在此之前引入jquery.js文件，顺序错误可能无法出现提示效果。给大家提供一个插件的github下载地址，里面有一些demo可以供大家参考。gritter—Github

下面是具体使用，首先定义一些显示效果，譬如

<style>
    .mygritter{//插件的类名
    position: fixed;//定位方式
    top: 50%;//top是距离页面的定位距离，50%为居中，下面的同理
    left: 50%;
    }
  </style>

这样，gritter插件简单的样式定制酒已经完成了，接下来是js代码的调用，很简单，就是一句话

 gritter(your message);//your message是我们自己想要输入的提示信息，这里可以是纯文本，也可以是html的图文混排内容，根据个人喜好添加。

现在，消息提示插件就可以使用了，试一试吧，希望能给大家的页面带来更好的体验。