4

JQuery addclass 根本没有添加类，因此 web-kit 转换不起作用。在下面的函数中，第一个添加类正在工作，而第二个则没有。到底是怎么回事。

功能

function closecont() {
    $('#contpanel').addClass('contentclosed');
    $('#slideback').addClass('slideback');
}

CSS

.gallery .content #slideback {
    position:absolute;
    background:url(images/ui/cont.png) center top;
    height:44px;
    width:24px;
    top:340px;
    left:254px;
    overflow:hidden;
    opacity:0.0;filter:alpha(opacity=0);
    -webkit-transition-property:opacity;
    -webkit-transition-duration:600ms;
}
.slideback {
    opacity:1.0;filter:alpha(opacity=100);
    -webkit-transition-property:opacity;
    -webkit-transition-duration:600ms;
}

关闭的内容运行良好。.slideback 不是。这是我制作的一个非常相似的小提琴。 http://jsfiddle.net/4WmJz/15/

有任何想法吗 。

奇妙

4

2 回答 2

5

您忘记将!important标志添加到您的样式中，但您在小提琴的前半部分使用了它。这就是为什么它与第一个元素一起工作。

默认情况下，CSS 规则按特定顺序应用。更具体的选择器会覆盖更通用的选择器，因此如果您向元素添加类（通用），则为项目 ID（特定）设置的 CSS 规则将优先。

.slideback {
    opacity:1.0 !important;filter:alpha(opacity=100) !important;
    -webkit-transition-property:opacity !important;
    -webkit-transition-duration:600ms !important;
}

你固定的小提琴：http: //jsfiddle.net/4WmJz/16/

于 2011-06-15T17:27:19.220 回答
0

代替

#reviews #test {
opacity:0.0;filter:alpha(opacity=0);
-webkit-transition-property:opacity, filter;
-webkit-transition-duration:600ms ,600ms;
 }

做这个：

 #reviews .hidden{
 opacity:0.0;filter:alpha(opacity=0);
 -webkit-transition-property:opacity, filter;
-webkit-transition-duration:600ms ,600ms;
}

然后这样做：

   <div id="test" class='hidden'>moved</div>

并将 js 更新为此：

$('#moveIt').click(function() {
$('#dropout').addClass('dropopen');
$('#test').removeClass('hidden');
$('#test').addClass('test');
return false;
});
于 2011-06-15T17:26:00.033 回答