使用jQuery显示通知的最佳方法 [英] Best ways to display notifications with jQuery

查看:89
本文介绍了使用jQuery显示通知的最佳方法的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个简单的CRUD表单。

I have a form which is a simple CRUD.

当用户输入或删除记录时,我试图显示一个很酷的成功消息。我在网上看到了这么多。

I am trying to display a cool looking success message when user enters or deletes a record. I've seen this a lot around the web.

我对jquery很新。有没有人知道任何可以说明如何做的例子?

I am very new to jquery. does anyone know any examples that would show how to do this?

基本上是一个慢慢调暗的div。

Basically a div that would slowly dim out.

推荐答案

你的问题有点模糊,因为看起来很酷的成功信息并不多见。

Your question is a little vague as a "cool looking success message" is not much to go with.

如果您有兴趣,通过回答这里的问题我已经复制了Stackoverflow的两个通知功能的功能,人们似乎很喜欢:顶部的横幅当您获得新徽章等时出现的页面,以及当某个操作出现问题时网站周围的红色框。我已经使用类似这些技术在我的应用程序中显示成功消息,我的客户也很喜欢它们。

If you are interested, however, through answering questions here I have replicated the functionality of two of Stackoverflow's "notification" features that people seem to enjoy: the banner at the top of the page that comes up when you get a new badge, etc. and the red boxes around the site whenever something goes wrong with an action. I've used techniques similar to these to show success messages in my applications and my clients have loved them.

  • To show the top banners - demo
  • To show the red boxes - demo

示例非常简单,因为它所做的只是在文档中的某处显示DIV并将其淡入视情况而定。这就是你真正需要开始的全部。

The examples are very simple, as all it is doing is showing a DIV somewhere in the document and fading it in and out depending on the situation. That's all you really need to get started.

除此之外,如果你是Mac粉丝(即使你不是),还有 jQuery Growl 插件,它基于OS X通知系统。我也是使用 BeautyTips 的狂热粉丝插件显示元素附近的消息,因为气泡非常漂亮且易于设计。

In addition to this, if you are a Mac fan (and even if you're not) there is the jQuery Growl plugin which is based on the OS X notification system. I am also a big fan of using the BeautyTips plugin to show messages near an element, as the bubbles are very nice and easy to style.

这篇关于使用jQuery显示通知的最佳方法的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆