jqueryのホバー出し入れ

Question

私はリスト内に4つのボックスを持っています。私は、ホバリング時に幅を100％に設定しようとしています。浮動小数点数を設定することなくうまく動作します。左にli要素があります。浮動小数点：左が設定されているとき、ホバリング時に右のボックスの上にあるホバーが点滅します。

コードはここにある - http://jsfiddle.net/PsYn9/5/

私は箱の＃2の上に置くと、ちらつきがあります。なぜこれが起こるのですか

Answer 1

onhoverはdivを100％に伸ばしたのでdiv1より下で開始します。

Answer 2

このボックスの上にマウスを置くと、マウスがトリガされ、幅が100％に設定され、ボックスが下に移動するので、上にマウスが乗っていないので、マウスが表示されますこれ以上mouseleaveがトリガーされるので、幅は48％に設定され、ボックスはまだマウスカーソルの前の位置に移動するので、マウスがトリガされ、幅は100％に設定され、ボックスは下に移動します...

Answer 3

liが伸びると、それは他の李と重複していませんが、によってそれ自身のための部屋を作ります。それを押してください。だから、2番目の列にあるリの上にマウスを置くと、それ自体がプッシュされるので、もうそれ以上の浮遊感はありません。

Answer 4

この現象は正常です。 2番目のボックスにカーソルを合わせると、ボックスがコンテナに収まりませんので、2番目の行にドロップされるので（フロートはこのように動作します）、これが発生します。そして、ボックスが2番目の行にドロップすると、ホバーを止めるようになり、元のサイズと位置に戻ります。そして、その場所に再び、あなたはそれを上に浮かべている、など...これは、そのちらつきの理由です。

解決策： 容器を広くし、箱に固定して使用してください。