向 jQuery toggleClass() 添加动画的问题

Question

您能否看看This Demo，让我知道如何将动画/速度或持续时间添加到以下代码中

$("#ecolomodel").on("click",function(){
   $("#ecolomodelno").toggleClass("switchshow switchhiden");
   $("#ecolomodelyes").toggleClass("switchhiden switchshow");

});

使用这个标记

<div class="panel panel-default">
    <div class="panel-heading">Switch</div>
    <div class="panel-body">
        <div class="row">
           <div class="switch col-lg-offset-1 col-md-offset-1 col-sm-offset-1 col-xs-offset-1 col-lg-10 col-md-10 col-sm-10 col-xs-10">
                <button id="ecolomodelno" class="btn btn-primary switchshow norightradius col-lg-1 col-md-1 col-sm-2 col-xs-3">No</button>
                <button id="ecolomodel" class="btn btn-primary noradius col-lg-11 col-md-11 col-sm-8 col-xs-9">New Model</button>
                <button id="ecolomodelyes" class="btn btn-primary switchhiden noleftradius col-lg-1 col-md-1 col-sm-2 col-xs-3">Yes</button>
           </div>
        </div>
    </div>
</div>

我已经尝试过类似的东西

$("#ecolomodel").on("click",function(){
   $("#ecolomodelno").toggleClass("switchshow switchhiden", 6000);
   $("#ecolomodelyes").toggleClass("switchhiden switchshow", 6000);

});

但它没有用！

Answer 1

我认为您确实需要研究 jQuery animate() 并了解它是如何工作的。这是一个非常简单易用的功能，我发现自己一遍又一遍地使用它。

您可以直接编辑 CSS。尝试查看和测试他们网站上的一些示例。