gpt4 book ai didi

jQuery onClick slideUp 和 addClass 不工作

转载 作者:行者123 更新时间:2023-11-28 17:52:27 24 4
gpt4 key购买 nike

我正在尝试在各个部分之间进行转换。
1. 向上滑动当前部分并应用“已完成”类。
2. 然后从底部向上滑动下一部分应用类“active”

我也想知道如何滑动该部分然后
删除该类,因为它是同时发生的
这导致它在向上滑动之前消失。

HTML:

<section class="active">
<h1>Hi, how are you?</h1>
<p>This is paragraph text!</p>
<button class="btn">Next</button>
</section>

<section>
<h1>Section number two.</h1>
<p>This is paragraph text!</p>
<button class="btn">Next</button>
</section>

<section>
<h1>Section number three.</h1>
<p>This is paragraph text!</p>
<button class="btn">Next</button>
</section>

CSS:

section {
display: none;
width: 400px;
background: rgba(000,000,000,.3);
border-radius: 5px;
text-align: center;
padding: 5px 0;
font-family: helvetica, sans-serif;
}

.active {
display: block;
}

jQuery:

$('button').click(function () {
$('.active').slideUp('fast').removeClass('active').addClass('completed');
$(this).next("section").slideUp().addClass('active');
});

最佳答案

大多数(全部?)jQuery 动画函数都有一个回调参数,一旦动画完成就会调用该参数:

$('.active').slideUp('fast', function() {
$(this).removeClass('active').addClass('completed');
});

关于jQuery onClick slideUp 和 addClass 不工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22027722/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com