jquery消息框保留区域错误

Question

我正在使用像this这样的jQuery消息框。我想在我的网络应用程序中使用它，但我仍然遇到一个问题。应保留整个弹出窗口的这个区域。如果你看到这个链接，你发现如果在关闭条件下弹出，那么当你将光标移动到底部时，它就变成了方便的光标。这显示了一个错误。

但是我想要做的就是制作一个jQuery通知框（就像我们的堆栈溢出一样）列出消息，当它关闭时没有固定区域预留问题。

任何人都知道这个好的插件吗？

任何人都可以解决这个问题吗？

Answer 1

问题在于消息框本身从未被隐藏，它的opacity值只有0，因此不可见但仍在进行中。您需要做的是更改其display属性值，就像StackOverflow在其消息框中所做的那样。

1。从.notifications中删除这两行：

transition: .2s;
opacity:0;

2. 将此行添加到.notifications（如果您希望默认情况下消息框为隐藏）：

display:none;

3. 将jQuery代码更改为：

$(document).ready(function () {
  $(".notificationicon").click(function () {

    $("#notificationMenu").fadeToggle(200);

  });
});

<强> codePen demo.

定制

如果要自定义缓动，可以将fadeToggle(200);更改为fadeToggle(200, 'EASING-TYPE');，其中EASING-TYPE是一个字符串值，指示用于转换的函数（默认为 swing < / em>但也可以线性）。