Javascript 将悬停转换为jquery的单击事件

我正在尝试将悬停事件转换为脚本中降级的jquery翻转部分。我已经为css3d转换完成了此操作，但我不确定如何为降级部分转换悬停事件。以下是我到目前为止的情况：

if($("html").hasClass("csstransforms3d")){

    $('.card').click(function () {

        if ($(this).hasClass('flip')) {
            $(this).removeClass('flip');
        }
        else {
            $(this).addClass('flip');
        }
    });

    /*
    $('.card').hover(function(){
        $(this).addClass('flip');
    },function(){
        $(this).removeClass('flip');
    });
    */
} 
else{
    // How do I add a click event here instead of hover?
    $('.card').hover(function(){
        $(this).find(".front").animate({top: -190}, 'fast');
    },function(){
        $(this).find(".front").animate({top: 0}, 'fast');
    });
}   

---

如何将悬停事件转换为降级部分的单击事件？

如果要使用单击，需要存储状态值-可以使用

试试像这样的东西

$('.card').click(function(){
    var $this = $(this);

    if($this.data('hidden')){
        $this.find(".front").animate({top: -190}, 'fast').data('hidden', false);
    } else {
        $this.find(".front").animate({top: 0}, 'fast').data('hidden', true);
    }

});

---

如果您想使用单击，您需要存储一个状态值-您可以使用

试试像这样的东西

$('.card').click(function(){
    var $this = $(this);

    if($this.data('hidden')){
        $this.find(".front").animate({top: -190}, 'fast').data('hidden', false);
    } else {
        $this.find(".front").animate({top: 0}, 'fast').data('hidden', true);
    }

});

---

将单词hover替换为click？您的意思是不是

mousedown

和

mouseup

？将“hover”替换为“click”@raam86否，不会这样工作。@raam86因为两个回调都将同时调用。OP正在寻找toggle（）事件，我想它现在被删除了：用click替换hover这个词？你的意思是不是

mousedown

和

mouseup

？用click替换hover？@raam86不，不会像这样工作。@raam86因为两个回调都会同时被调用。OP正在寻找toggle（）事件，我想，它现在被删除了：看起来是一个很好的解决方案，但由于某些原因，数据属性没有设置…有什么想法吗？我首先设置了数据属性，然后检查了状态，但它正在工作…谢谢！看起来是一个很好的解决方案，但由于某些原因，数据属性没有设置…有什么想法吗？我首先设置了数据属性，然后检查了状态，但它正在工作…谢谢！