jquery-animate - ボーダーボックスは、jQuery アニメーションで疑似要素を非表示にします

Question

適用時に疑似要素が表示されないという奇妙な問題があります。

box-sizing:border-box;

テストケース 1: http://jsfiddle.net/kGGuP/1/ - これは期待どおりに機能しました。ボックスをクリックするとコンテンツが表示され、「矢印」疑似要素も表示されます。

テストケース 2: http://jsfiddle.net/XGGg4/ - 追加しました

* {
    -moz-box-sizing:border-box;
    -webkit-box-sizing:border-box;
    box-sizing:border-box;
}

CSSに。ご覧のとおり、" arrow " 疑似要素はもう表示されません。これは、Firefox を除くすべてのブラウザーで発生します。

box-sizing:border-box; を削除する以外に、これに対する修正はありますか? ? 私は本当にこのルールを削除したくありません。

追加情報：

パラメータを持つ .toggle() と.slideToggle()だけがこの問題を抱えているようです。

パラメータなしで .toggle()と.fadeToggle()を使用すると、正常に動作します。

score 0 · Accepted Answer

ここにリンクがありますhttp://jsfiddle.net/XGGg4/1/

私はCSSファイルに小さな変更を加えましたあなたが望むようにコードでそれをチェックしてください

あなたが使用することができた

*{
    -moz-box-sizing:content-box;
    -webkit-box-sizing:content-box;
    box-sizing:content-box;
}

上記のコードは、コードにも役立ちます

score 0 · Accepted Answer

これをチェックしてくださいhttp://jsfiddle.net/XGGg4/5/

追加する

*{
    -moz-box-sizing:border-box;
    -webkit-box-sizing:border-box;
    box-sizing:border-box;
}

コードを本当にねじ込みます。代わりにbox-sizing:border-box;、個々の要素ごとに設定できます。それはあなたのために魔法を行います。

2 に答える 2