生成像StackOverflow这样的“toast”消息

我每次构建Web应用程序时都会想到的一个问题是消息应该如何显示给最终用户

我尝试过像Windows应用程序中的消息框，但它们看起来很糟糕，并且在服务器上发布时会出现问题。 我在页面底部的顶部尝试了一个包含很酷标签的更新面板。但是我觉得它根本不够好。 有时在使用AJAX时我在特定情况下遇到问题，但对用户来说仍然不太好…

我想询问一段时间后出现的StackOverFlow消息，然后消失，例如，在向上或向下投票时以橙色显示的消息。

我想构建这样的消息或重用可以提供这些的DLL。 这可行吗？

note :::根据服务器端的特定条件为用户显示消息。

提前致谢。

Answer 1

好吧，通过.cs使用jGrowl（扩展Shane的答案）的一种方法如下所示。

这个例子在webform ASP.NET中

使用1个按钮创建一个简单的aspx页面，并确保在页眉中包含必要的jquery / jgrowl脚本和css引用，我还在页面上有一个ScriptManager和更新面板。

在页面背后的代码中：

protected void Button1_Click(object sender, EventArgs e) { this.ShowStatus("This is your message!
Some HTML formatting works!
"); } protected void ShowStatus(string message) { ScriptManager sm = ScriptManager.GetCurrent(Page); if (sm.IsInAsyncPostBack) { string script = @" $(document).ready(function() { $.jGrowl.defaults.theme = 'iphone'; $.jGrowl('" + message + "', {theme: 'iphone',header: 'Notification',life: 8000});});"; ScriptManager.RegisterStartupScript(Page,this.GetType(), "notification", script,true); } } 

自然地使用适合您的应用程序的任何主题，祝你好运！ 此外，此方法仅根据需要加载通知脚本（在这种情况下，单击按钮后），但您可以将“ShowStatus”函数绑定到后面的代码中的其他事件/测试。

Answer 2

具体来说， jGrowl jQuery插件可以满足您的需求。

只需在html中包含jQuery和jGrowl脚本，然后使用$ .jGrowl（）函数开始生成消息。

示例代码：

        click me   

Answer 3

要创建效果，您可以使用这些工具

jQuery的

jQuery用户界面库。 它提供了用于创建富Internet应用程序的交互，窗口小部件，效果和主题

你可以在这里查看一些Jquery效果

MooTools的

基于Mootools JavaScript框架构建的Web应用程序用户界面库

Answer 4

另一个非常好的JavaScript通知插件是Pines Notify

它还具有通知历史记录小部件。

Answer 5

Notimoo插件使用mootools。
仅在昨天使用，并且喜欢配置选项。

http://code.google.com/p/notimoo/