当前位置：文江博客话题详情

jQuery淡入/输出确认文本

发布于 2025-01-25 03:12:59 字数 443 浏览 4 评论 0原文

我在页面上有一个div，默认情况下是空的（和/或隐藏的），以及应该在不同操作后的确认文本打印一会儿，然后消失。

我想和jQuery一起做这件事，但陷入了褪色。

我使用了此代码：

＆lt; div id ='确认'样式='display：none'＆gt;＆lt;/div＆gt;

$（'＃crescentation'）.html（“＆lt;字体color ='green'＆gt;成功

！文字进入此Div。即使在文本更改后，它仍然继续尝试淡入前一个，然后再次淡入。

我希望它的行为是这样的：当发送几个确认时，它们之间的延迟几乎应该停止执行当前序列并从头开始启动（立即淡出，立即更改文本，然后慢慢褪色）。

同样，对于初始“显示：无”，第一个序列的行为也有所不同。

您能建议某种方法来实现我想要的东西吗？

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

风渺 2025-02-01 03:12:59

您可以使用jQuery .stop（）。可能是您需要更改它们的位置以创建完美的序列，但我希望您明白这个想法。 ✌️

编辑：忘了添加Clearqueue true命令。您可以在

$('#cc').click(function(){
  $('#confirmation').stop(true, false).html("Success").fadeIn(300).delay(3000).fadeOut(300);
});

#confirmation {
color:#000;
  border: 1px solid #CCC;
  display:none;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="confirmation"></div>
<div id="cc">Click to confirm</div>

You can use jQuery .stop() for that. Can be that you need to change the location of them to create the perfect sequence but I hope you get the idea. ✌️

Edit: forgot to add clearQueue true command. You can find more intel on https://api.jquery.com/stop/

$('#cc').click(function(){
  $('#confirmation').stop(true, false).html("Success").fadeIn(300).delay(3000).fadeOut(300);
});

#confirmation {
color:#000;
  border: 1px solid #CCC;
  display:none;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="confirmation"></div>
<div id="cc">Click to confirm</div>

回复收藏 0 原文

~没有更多了~