Question

我想翻转一个简单的图像＆＃34; mouseover＆＃34;使用Jquery插件Flippy，现在的问题是当我＆＃34; mouseover＆＃34;它。我是一个JS初学者，因此我很抱歉这可能是一个相当简单的问题..

我的代码如下所示：

$(".chameleonclass").mouseover(function() {
$(".chameleonclass").flippy({
content: '<img class="top" src="a1records.jpg" alt="a1records"/>',
direction:"TOP",
duration:"750",
onFinish:function(){
}
});
});

现在，我想我必须在onFinish部分添加一些内容。我已经尝试了我想出的所有内容（结束，停止等），但没有任何实际工作，当鼠标悬停在对象上时，对象只是循环并翻转多次而没有结束。

你能帮助我吗？提前感谢您阅读并度过了一个美好的周末蒂姆

Answer 1

我有同样的问题，但终于设法思考了。我们的想法是在第一次发生时关闭事件触发器。然后当鼠标离开时再触发它。

我希望你能理解代码，但我得到了它。

<script>

    $(document).ready(function(){
        $(".flipbox").on("mouseenter",function(){
                $(this).flippy({
                    color_target: "red",
                    verso:"jippii",
                    duration:"500",
                    direction: "TOP",
                });
                $(".flipbox").off("mouseenter");
        });
        $(".flipbox").on("mouseleave",function(){
                $(this).flippyReverse();
                $(".flipbox").on("mouseenter",function(){
                $(this).flippy({
                    color_target: "red",
                    verso:"jippii",
                    duration:"500",
                    direction: "TOP",
                });
                $(".flipbox").off("mouseenter");
        });

        });
    });
</script>

Jquery Mouseover对象无限循环与Flippy插件

1 个答案: