Question

点击按钮时，我想尝试转换。该按钮基本上是一个触发Jquery函数的div。该按钮由一些文本和FontAwesome图标组成。

我想以一种方式使用JQuery，当我点击按钮时，FA图标的大小会快速改变并返回，因此人们可以获得点击按钮的某种动画确认。我创建了一个带有转换的类，它至少增加了字体大小：

#keepbtn.clicked {
    font-size:3em;
    opacity:0.8;
    -webkit-transition: all 0.1s ease 0s;
    -moz-transition: all 0.1s ease 0s;
    -ms-transition: all 0.1s ease 0s;
    -o-transition: all 0.1s ease 0s;
    transition: all 0.1s ease 0s;   
}

我尝试使用延迟在之间切换：

$("#keepbtn").toggleClass("clicked").delay(250).toggleClass("clicked");

但这不起作用;它没有改变任何东西。但是，这有效（但当然不会将其改回原始大小：

$("#keepbtn").toggleClass("clicked");

有什么想法吗？我对转换和JQuery很新，所以我可能会采用错误的方法。

提前致谢。

Answer 1

为了使delay（）能够处理非动画元素，你必须排队＆＃34;排队＆＃34;运营商：

$("#keepbtn")
    .toggleClass("clicked")
    .delay(250)
    .queue(function(nxt) {
         $(this).toggleClass("clicked");
         nxt();
    });

使用JQuery toggleclass来操作点击过渡

1 个答案: