Question

运行.fadeIn()时，jQuery会自动将display:block内联添加到选择器：

$('div').hide().fadeIn();

结果是否可能如下所示：

<div class="active"></div>

而不是：

<div style="display:block"></div>

我不想添加/删除任何内联样式。我无法移除style属性，因为可能已设置了我无法控制的样式。我只想在fadeIn()上添加一个课程，而不是添加内联display:block样式。

Answer 1

您可以尝试添加active类并在display完成后清除fadeIn()样式，如下所示：

$('div').hide().fadeIn(400, function() {
    $(this).css('display', '').addClass('active');
});

以下是一个简单示例：JS Fiddle

Answer 2

是的，您必须先使用css隐藏div，然后使用转换和不透明度来显示它。

JSFiddle

<强> HTML

<div></div>

<强> CSS

div {
    background:blue;
    width:100px;
    height:100px;
    opacity:0;

    -o-transition: opacity .6s ease;
    -ms-transition: opacity .6s ease;
    -moz-transition: opacity .6s ease;
    -webkit-transition: opacity .6s ease;
    transition: opacity .6s ease;  

}

div.active {
    opacity:1;
}

<强>的Javascript

$('div').addClass('active');

jQuery fadeIn（）可以添加一个类而不是内联样式吗？

2 个答案: