Web Kit 转换左功能不起作用 - 解决小提琴问题

Question

我在 webkit 转换中的position:relative 元素上遇到了巨大的麻烦，无法将其移动到左侧。它应该有效，但没有。通过 jQuery 添加一个类，然后该类应该会生效。

<div id="reviews">
    <div id="dropout">Blast</div>

    <a href="#" onclick="dropout(); return false">move it</a>
</div>

#reviews #dropout {
    position:relative;
    min-height:40px;
    left:40px;
    -webkit-transition: left 600ms;
    -moz-transition: left 600ms;
}
#reviews .dropopen {
    min-height:40px;
    left:0px;
    -webkit-transition: left 600ms;
    -moz-transition: left 600ms;
}

function dropout() {
    $('#dropout').addClass('dropopen');
}

也许小提琴可能会有所帮助 http://jsfiddle.net/4WmJz/1/

有什么想法吗？

奇妙

Answer 1

已解决！ （我希望）

有几个问题。首先，onclick() 函数未正确绑定，jQuery 未加载到 jsFiddle 页面上，最重要的是，选择器的特殊性是错误的。基本上，#id #id 选择器比 #id .class 具有更高的特异性，因此即使将类正确添加到元素，也不会应用属性。

编辑另一个链接到精彩可视化的机会CSS 特异性。