1

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/

何か案は？

素晴らしい

4

1 に答える 1

1

解決しました！（私は願います）

いくつかの問題がありました。まず、onclick()関数が正しくバインドされていませんでした。jQuery が jsFiddle ページにロードされていませんでした。また、最も重要なこととして、セレクターの特異性が間違っていました。基本的に#id #idセレクターは よりも特異性が高い#id .classため、要素にクラスが正しく追加されていても、プロパティは適用されません。

別の機会に編集して、CSS の特異性の素晴らしい視覚化にリンクします。

于 2011-06-10T14:35:25.620 に答える