jquery - Ajax 请求的漂亮小滑入/滑出通知

Question

在应用程序的许多地方，我都有导致 AJAX 请求的按钮/内联编辑。但是，现在用户没有收到有关该操作的任何反馈。

你知道有什么插件会在我执行请求时在页面顶部显示（滑入）一个小框（类似于 StackOverflow 上的此处，但更小，如 100px 宽度和文本：正在保存...），并在我执行请求时显示消息，然后我可以在请求完成后淡出吗？

Answer 1

你可以自己做。只有 CSS 和 JS 发挥作用。:)

HTML：

​<div class="notifications"​​​​​​​​​​>
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.
</div>​​​​​​​​​​​​​​​​​

CSS：

​.notifications {border: 1px solid #ccc; background: #f5f5f5; width: 200px; position: absolute; top: 0; left: 0;}​

JavaScript：

​$(document)​.ready(function(){
    $(".notifications").css("top", -$(".notifications").height());
    setTimeout(function(){
        $(".notifications").animate({top: 0}, 1000);
    }, 1000);
});​

小提琴：http: //jsfiddle.net/kWuww/

插件：

1. 诺蒂
2. 咆哮

Answer 2

我在所有项目中都使用http://stanlemon.net/pages/jgrowl。

编辑：正如@eicto 在评论中所说，noty 插件看起来非常棒，我会从现在开始考虑使用它，因为它有更多的选择。