3

行全体ではなく、テキストにのみマウスホバー効果を提供するにはどうすればよいですか。私はPosition()で試しましたが、空の状態でカムアウトします.以下はフィドルリンクです,

<ul id='ulid'>
<li>Task1</li>
<li>Task2</li>
<li>Task3</li>
<li>Task4</li>
<li>Task5</li>
<li>Task6</li>
<li>Task7</li>
</ul>

<br /><br />


<br /><br />

<div id="show_details"></div>

jQuery(document).ready(function() {


$('ul#ulid li').hover(function() {
    $('#show_details').html($(this).text());
}, function() {
    $('#show_details').html('');
});
});

助けてください

4

2 に答える 2

5

li要素をブロック表示することはできません。処理する方法はたくさんありますが、簡単な方法の 1 つは、それらをスパンでラップし、それらのスパンで をトリガーすること.hoverです。

<li><span>Task1</span></li>
...
$('ul#ulid li span').hover(function() {

http://jsfiddle.net/xneG5/

プログラム: http://jsfiddle.net/xneG5/2/

CSS のみ: http://jsfiddle.net/xneG5/3/

于 2013-01-29T05:05:39.477 に答える
0

li要素のマージンとパディングを0に設定すると、この問題を解決できる可能性があります。行全体をトリガーする理由は、liにはデフォルトのマージンとパディングが付属しているためです。

于 2013-01-29T05:13:08.697 に答える