0

いくつかの「li」要素を含む順序付けられていないリストがあります。アイデアは、現在フォーカスされている(onhover)現在の「li」を強調することです。

このようなコードを使用する

li[i].onmouseover = function() {
    this.style.backgroundColor = 'lime';
    this.style.borderLeft='5px solid red';
    this.style.listStyle = 'square';
};

これが実用的なフィドルです

フィドルで発生している、ホバーされた要素に左の境界線を表示したい。しかし、それはテキストを右にシフトしているようです。ジャンプするテキストの動作を取り除くにはどうすればよいですか?

次の質問は、ul の独自のシンボルを作成できるかどうかです。現在、正方形と円盤を切り替えています。各「li」に派手なアイコンを付けることは可能ですか?

4

3 に答える 3

1

ホバリングしていないときに同じ幅の透明な境界線を追加します。また、スタイルを動的に変更する代わりに、className を変更して、スタイルを所属する場所に保持してください。

疑似要素 :hover を使用できる場合はさらに良いです (本当に IE をサポートする必要がある場合を除きます.. argh..)

于 2013-05-15T08:31:29.687 に答える
0

これは、css トリックで実行できるコードです。これを css に追加します。

ul li {line-height:30px; padding-left: 15px; border-left:5px solid white}

それはここでうまく動作し ます

于 2013-05-15T08:30:43.613 に答える