解决方案

Question

我正在尝试使用jquery在鼠标悬停上来回摇动一个简单的图像。图片ID为“img”。

   $(document).ready(function () {
        $("#img").bind('mouseenter', function () {
            $('#img').rotate(43);  
        });
        $("img").bind('mouseleave', function () {
            $('#img').rotate(-43);              
        });
    });

当我这样做时，第一次旋转工作，但第二次没有。为什么是这样？我可以单独使用第二个，它也按预期工作。我不能让两者一起工作。我使用库来旋转。如果我为旋转提醒我仍然不能第二个工作。有什么建议？ TIA 约翰

Answer 1

如上所述，这可以使用.hover()

完成

$(document).ready(function () {
  $("#img").hover(
    function () {
      $(this).rotate(43); 
    },
    function () {
      $(this).rotate(-43); 
    }
  );
});

Answer 2

我猜你正在使用this plugin，并查看它进行旋转的方式，它将img转换为一个取消绑定悬停事件的canvas元素，你需要某种方法来重新绑定事件，或以画布元素开始。

解决方案

使用不同的插件会让它变得轻而易举。 You can download it here.

$(document).ready(function(){
    $("#img").live('mouseenter', function() {
        $('#img').rotate(43);
    });
    $("img").live('mouseleave', function() {
        $('#img').rotate(-43);
    });
});

jsFiddle Demo

Answer 3

马上就好了。

 $("img").bind('mouseleave', function () {
        $('#img').rotate(-43);              
    });

应该是

 $("#img").bind('mouseleave', function () {
            $('#img').rotate(-43);              
        });

当mouseenter和mouseleave时，jquery创建事件

3 个答案:

解决方案