Javascript 淡入div onclick按钮

嗨，伙计们，我有两个DIV，里面有信息，我想要它，这样当用户点击按钮1/2时，它会显示正确的DIV。我已经设法走到这一步，并使其工作，但是我想尝试在它们上面放一个动画，这样它会很快出现在屏幕上。因此，当他们点击按钮时，文本淡入淡出。我不确定是否有一个用于此的库，因为我以前使用过AOS库，但这是用于滚动的，而不是单击功能

HTML:

 <button type="button" class="btn btn-warning" id="header1">Företagstelefoni</button>
  <button type="button" class="btn btn-warning" id="header2">Reklambyrå</button>

        <div class="parallax1" id="section_one" >
            <div class="row newtryh2">
                 ........
            </div>
       </div>

        <div class="parallax1" id="section_two">
            <div class="row newtryh2">
                 ........
            </div>
       </div>

CSS:

所以我只是想添加一些动画，比如很好地淡入淡出，这样它就不会在屏幕上捕捉并淡出。如果有人能帮我解决这个问题，或者知道任何库，比如AOS，它可以在onclick上工作，那就太好了

谢谢

使用fadeIn和fadeOut

IE$section_two.fadeIn'fast'

相反，你可以使用

编辑

带有回调的函数如下所示：

$("#section_two").fadeOut('slow', function() {
    $("#section_one").fadeIn('fast'); // Or whatever your selector is
});

---

如果您已经在使用jquery，为什么不使用fadeIn/fadeOut呢？我能问一下为什么当你按下按钮时，小提琴上的文字会像跳上跳下一样？一种淡出的症状。。。可能应该立即隐藏起来，并且只会消失，那么我将如何使用fadeToggle？我正试图把它加进去，因为我认为这是最好的选择，但现在我的两个divshow@AnthonyRivas谢谢：我认为fadetoggle将是我最好的选择，这是另外一个问题。。您需要将淡出设置为具有fadeIn回调的函数，以便它在发出fadeIn之前等待淡出完成

.parallax1 {
    padding-left: 30px;
        margin-top: 33px;
        display: none;
}

$("#section_two").fadeOut('slow', function() {
    $("#section_one").fadeIn('fast'); // Or whatever your selector is
});