jQuery滑动函数与CSS动画冲突

时间:2013-09-02 11:53:46

标签: javascript jquery css css3

我正在尝试在元素上使用slideUp和slideDown函数,但是当我在同一元素上应用CSS动画时似乎存在冲突。 http://jsfiddle.net/zgYNg/

在上面的示例中,我在悬停上使用CSS转换,但似乎与jQuery的函数存在冲突 它似乎工作的唯一方法是在滑动之前删除类buggly

.buggy{
        -webkit-transition: all 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000);
        -moz-transition: all 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000);
        -ms-transition: all 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000);
        -o-transition: all 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000);
        transition: all 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000);
}

1 个答案:

答案 0 :(得分:1)

只需将所有内容更改为css .buggy中的背景

.buggy{
        -webkit-transition: background 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000);
        -moz-transition: background 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000);
        -ms-transition: background 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000);
        -o-transition: background 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000);
        transition: background 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000);
}

demo