javascript - jQuery 在使用动画功能时为 div 添加背景

Question

我正在使用 jquery 循环插件和 jquery。
当循环的 div 的高度发生变化时，我为 jquery 循环 div 设置动画。下面的 div 根据高度向上或向下。

问题是下面的 div 向下滚动时会得到一个(白色)背景。我希望下面的 div 始终透明。 (在我的示例中，我希望内容 div 始终透明)

这是为循环的 div 设置动画的代码

function onAfter(curr, next, opts, fwd) {
        var index = opts.currSlide;
        $('#prev,#prev2,#prev3,#prev4,#prev5')[index == 0 ? 'hide' : 'show']();
        $('#next,#next2,#next3,#next4,#next5')[index == opts.slideCount - 1 ? 'hide' : 'show']();
        //get the height of the current slide
        var $ht = $(this).height();
        //set the container's height to that of the current slide
        $(this).parent().animate({height: $ht});
    }

    $('.subheader').cycle({after: onAfter});

这很难解释，所以我做了一个 jsfiddle 来展示它:jsFiddle

Answer 1

发生的事情是 overflow: hidden 在被动画化时被添加到 subheader div 中。这样做会使它剪辑文本。

如果您自己制作动画并且只设置高度，那应该可以防止问题发生。

或者，我可以使用 !important 样式规则绕过它:Fiddle

.subheader {
    overflow: visible !important;
}

之所以可行，是因为 !important 样式规则比内联样式具有更大的权重(除非内联样式也具有 !important，在这种情况下那会赢)。