3

<ul>/<li>とCSSでメニューを作っています。

これが私がこれまでに持っているものです: https://jsfiddle.net/gANfS/6/

問題は、5 ピクセルのマージン内の上端にマウスを合わせると、ブロックのサイズが大きくなったり小さくなったりするため、ホバーした状態とホバーしていない状態の間を行ったり来たりしておかしくなり始めることです。どうすればこれを修正できますか? リーを縮小するとき、ホバー領域を縮小したくありません。それはそれを修正しますが、私はそれをやってのける方法がわかりません。アイデア?

4

3 に答える 3

1

これはハックの仕事です...しかし、うまくいきます

それ以外のmagin-top:5px;

行うborder-top:5px solid black;

背景を別の色にしたい場合は、境界線の色を同じ色に設定してください。

于 2012-06-21T14:25:37.333 に答える
0

コンテンツをdivにラップしてliから、縮小をそのdivに(.sel div:hoverではなくli:hover)適用すると、これでうまくいくはずです。

于 2012-06-21T14:12:29.777 に答える
0

その理由はマウスオーバーで、ボタンが下に移動してを設定しmargin-top 5pxます。次に、マウスがその上端にある場合、ボタンは「ホバー」状態ではなくなり、元に戻ります。戻ると、マウスオーバー状態に切り替わり、旅が再開されます。

padding-top:5px代わりにを使用margin-topして、コンテナ全体にHOVER効果を設定できます。マージンではなく、パディングは要素内のスペースです。そうすれば、マウスが上端にあるときでも、要素の上にあると見なされ、ちらつきはなくなります。

于 2012-06-21T14:12:39.163 に答える