-1

当一个带有 jq 类的元素悬停在上面时,我有这段代码可以为背景设置动画。代码选取当前的背景颜色并将其设置为新颜色,然后在鼠标移出时颜色恢复为原始颜色。如果一个动作一个接一个地执行得太快,代码会在元素完全恢复到原始颜色之前拾取元素的背景颜色。因此,我需要有 jQuery animate 函数的 complete() 和 if 语句之类的东西,但显然它对我不起作用。如何在动画完成所需的时间内禁用代码?

$(document).ready(function(){ 

            var isHovered = false; 
            $(".jq").hover( 
             
                 if(!isHovered) {            
                    isHovered = true;
                    function(){ 
                        var bgcol = $(this).css('backgroundColor');
                        $(this).animate({     
                            backgroundColor: "#DDD",
                            color:"#111"
                        }, trans).data('hoverbackground', bgcol);
                    },
                    function() {      
                        $(this).animate({
                            backgroundColor: $(this).data('hoverbackground'),
                            //backgroundColor: "#EFEFEF",
                            color:"#888"
                         }, trans, complete: function() {
                         isHovered = false;}).removeData('hoverbackground');
                    }
                  });                         
                });
4

1 回答 1

0

我已经整理出来,部分解决了问题。在动画完成之前,该行为会被移除,但是通过引用函数中的任何 jq 分类元素,会使一个元素的 isHovered 影响紧随其后悬停的任何其他元素。换句话说,该函数不区分动画是在哪个元素上完成的。

 $(".jq").hover( 


                function(){ 

                    if(!isHovered) { 
                     isHovered = true;
                        var bgcol = $(this).css('backgroundColor');
                        $(this).animate({     
                            backgroundColor: "#DDD",
                            color:"#111"
                        }, trans).data('hoverbackground', bgcol);
                }},
                function() {   

                    $(this).animate({
                        backgroundColor: $(this).data('hoverbackground'),
                        //backgroundColor: "#EFEFEF",
                        color:"#888"
                    }, trans, function() {
                    isHovered = false;}).removeData('hoverbackground');

               });   

    });
于 2013-08-22T09:40:44.680 回答