css - jquery.ui 隐藏固定元素

Question

我想使用 jquery 的 hide() 函数来隐藏页面上闪烁的消息。

当我加载页面时，我想显示它 5 秒然后让它消失。

$('#flash-message').show("clip");

setTimeout(function() {
    $("#flash-message").hide("clip", { direction: 'vertical' }, 1000);
}, 5000);

如果我使用固定或绝对位置并且我需要将消息放在页面顶部的固定位置，它不会执行“动画”。

有解决办法吗？感谢您的帮助

Answer 1

要在页面加载时调用事件，请使用:

$(document).ready(function(){ 
   //code here 
});

如果你只想使用“clip”试试这个:

$("#flash-message").hide("clip", {direction: "vertical"}, 5000) 

或者尝试使用动画:

$('#flash-message').animate({
    opacity: 0.25,
    direction: "left",
    }, 5000, function() {
        $(this).hide();
});

或者更简单的:

$("#flash-message").click(function() {
  $("#flash-message").fadeOut("slow");
});