jquery - QuickFlip JQuery 插件

Question

我正在使用 quicklfip ( http://jonraasch.com/blog/quickflip-2-jquery-plugin ) 作为汉字抽认卡。前面板将具有字符，后面板将具有定义。我遇到的问题是我想显示例句，但只有在后面板可见时才显示。似乎没有任何回调函数。任何 JQuery 专家对我如何做到这一点有任何想法？

Answer 1

每个页面都有一个带有回调的更新插件。您可以使用 onBefore 和/或仅通过内容进行操作：

http://lab.smashup.it/flip/

$("#flipbox").flip({
    direction:'tb',
    onBefore: function(){
            console.log('before starting the animation');
    },
    onAnimation: function(){
            console.log('in the middle of the animation');
    },
    onEnd: function(){
            console.log('when the animation has already ended');
    }
})

Answer 2

经过一番头疼后，我终于想出了答案..它比我想象的要简单。我需要做的就是创建 2 个函数，如下所示：

function showExamples() {
            $('#examples').show();
        }
        function hideExamples() {
            $('#examples').hide();
        }

然后<a>在卡片的每一面放置一个标签，不仅可以翻转卡片，还可以调用上述函数！像这样：

<a class="quickFlipCta" href="#" onclick="javascript:showExamples()">Click to flip</a>

和

<a class="quickFlipCta" href="#" onclick="javascript:hideExamples()">Click to flip</a>

任务完成！