0

这是代码:

 $('.rightside').click(function(){
    if($('#clickForm').is(":visible")) {
       $('#clickForm').hide("slide", { direction: "left" }, 500);
       $('.left_slider').animate({left:"0"}, 500).css('background-image','url(images/leftPanel/gear.png)').attr('title','Open');

       $("#blackbg").hide();
    }
    else
    {
       $('#clickForm').show("slide", { direction: "left" }, 500);
       $('.left_slider').animate({left:"314px"}, 500).css('background-image','url(images/leftPanel/close.png)').attr('title','Close');
        $("#blackbg").show();
    }
 });

问题是这样的。这是动画前的图片

动画前

和动画之后

后

在我将鼠标至少移动 1px 或单击之前,它会一直保持这种状态。对于工具提示,我正在使用 Tipsy。如果有帮助,我可以自己做。

4

2 回答 2

1

对于悬停,使用 .animate() 回调在动画后删除悬停事件

jQuery 文档:http ://api.jquery.com/animate/

例子:

$('.left_slider').animate({left:"0"}, 500, function(){
    $(this).css('background-image','url(images/leftPanel/gear.png)').attr('title','Open');
    //Remove your hover events here
});
于 2012-09-20T10:16:03.963 回答
0

如果其他人遇到同样的问题,请回答我自己的问题:

我所要做的就是添加

$(".tipsy").remove();

就在点击功能之后。

因此,如果您正在使用 jquery 动画并且遇到提示问题,只需添加上面的代码。

关于悬停,我用 jquery 做到了。也许有更简单,更“正确”的方法来做到这一点,但在那之前,这将是:

    $('.rightside').click(function(){
    $(".tipsy").remove();
    if($('#clickForm').is(":visible")) {
       $('#clickForm').hide("slide", { direction: "left" }, 500);

       $('.left_slider').animate({left:"0"}, 500).css({'background-image':'url(images/leftPanel/gear.png)',
                     'background-color':'#fff'}).attr('title','Open');

       $("#blackbg").hide();
    }
    else
    {
       $('#clickForm').show("slide", { direction: "left" }, 500);
        $('.left_slider').animate({left:"314px"}, 500).css({'background-image':'url(images/leftPanel/close.png)',
                     'background-color':'#fff'}).attr('title','Close');

       $("#blackbg").show();
    }
 });
于 2012-09-20T11:15:27.060 回答