javascript - Chrome、jqueryはぐらつきをアニメーション化します

Question

Chromeにのみ影響する問題があります。さらに、画面が特定の幅にある場合にのみ表示されます。

問題を再現できるフィドルを作成しました。

赤いボックスをロールオーバーすると、親の幅がアニメーション化され、赤いボックスがさらに表示されます。

ぐらつきが表示される前に、HTMLペインの幅を数回調整する必要がある場合があります。

これを解決するための最善の方法について何か考えはありますか？

ありがとう

score 3 · Accepted Answer

float:right絶対に配置する代わりに使用してください。

これは、幅を変更すると右に伸び、リフローして左に戻って正しい位置に戻り、ぐらつきが発生するために発生します。右に浮かせると、常にそこに保持されます。

明確にするために：正しい結果を得るには、位置：絶対幅float：#widgetと.hiddenの両方で右を置き換える必要があります。

score 0 · Accepted Answer

位置を使用する場合は使用する必要がleftありtop、この場合は役に立ちません。この方法でfxyoucssを試してください

#wrapper{
    width: 100%;  // was 600px
    height: 100px;
    margin: 0 auto;
    //position: relative; 
}

2 に答える 2