Question

我是jquery的新手，我有兴趣使用flipy插件移动图片。我去了网站http://blog.guilhemmarty.com/flippy/。

在示例中我发现了这个

$("#myFlippyBox").flippy({
content:"Hi !",
direction:"TOP",
duration:"750",
onStart:function(){
    alert("Let's flip");
},
onFinish:function(){
    alert("ok, it's flipped :)");
}
});

我希望在我的代码中使用它。我创建一个id为myFlippyBox的div，并为其指定宽度和高度。在js上我写这段代码

<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.min.js">   </script>
<script type="text/javascript" src="js/jquery.flippy.min.js"></script>
<script>
   $(document).ready(function(){

$("#myFlippyBox").click({
$(this).flippy({
content:"Hi !",
direction:"TOP",
duration:"750",
onStart:function(){
    alert("Let's flip");
},
onFinish:function(){
    alert("ok, it's flipped :)");
} 
});
});

});

</script>
 </head>

 <body>

 <div id="myFlippyBox" height ="200px" width="200px">
    Test message
 </div>

 </body>

 </html>

它给了我错误，并没有为我工作

Answer 1

.click()期望一个函数作为参数，在那里传递$("#myFlippyBox").click({...});而不是$("#myFlippyBox").click(function(){...});

尝试

$(document).ready(function() {
    $("#myFlippyBox").click(function() {
        $(this).flippy({
            content : "Hi !",
            direction : "TOP",
            duration : "750",
            onStart : function() {
                alert("Let's flip");
            },
            onFinish : function() {
                alert("ok, it's flipped :)");
            }
        });
    });
});

flipy jquery插件

1 个答案: