Animate.css不适用于第二次单击 [英] Animate.css doesnt work for Second click

问题描述

如果我第一次单击.img-1或.img-2，它将起作用. bt没有第二次没有页面刷新.我正在使用Animate.css(zoomIn).这是代码示例-

If i click .img-1 or .img-2 first time it works. bt not in second time without page refresh. I am using Animate.css (zoomIn). Here is the code sample --

html:

<a class="thumbnail img-1"></a>
<a class="thumbnail img-2"></a>

<p class='back-end'>
<p class='front-end'></p>
<h1 class='dismiss pull-right'>&times;</h1>

jquery:

$('.img-1,.img-2').click(function(){
    $('.back-end,.front-end,.dismiss').addClass('animated zoomIn').show();
})

$('.dismiss').click(function(){
    $('.back-end,.front-end,.dismiss').addClass('animated zoomOut');
})

推荐答案

在jsfiddle中查看 http://jsfiddle.net/oxu69Luw/

See it in jsfiddle http://jsfiddle.net/oxu69Luw/

脚本如下:

$(function () {
    function applyZoomInOutAnim(x) {
        $('.back-end,.front-end,.dismiss').removeClass("zoomIn zoomOut").addClass(x + ' animated');
    }

    $('.img-1,.img-2').click(function () {
        applyZoomInOutAnim('zoomIn');
    });

    $('.dismiss').click(function () {
        applyZoomInOutAnim('zoomOut');
    });

});

这篇关于Animate.css不适用于第二次单击的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！