如何检测自定义项目符号上的鼠标悬停<li>？

Question

我有一个带有自定义图像项目符号的列表。如果用户将鼠标悬停在项目符号图像上，我想：

• 显示标题属性，或
• 显示辅助对象文本

如果需要，我可以使用基于JavaScript的解决方案

我的来源如下：

<style>
  li.important { list-style-image: url(important.png) }
</style>
<ul>
  <li class="important">Test</li>
  <li>Test</li>
</ul>

编辑：我希望鼠标悬停/标题文本只显示在项目符号上，但不显示在<li>的正文上。

Answer 1

据我所知，不可能将鼠标悬停在项目符号上，而不仅仅是<li>项目。

另一种选择（有点脏，但嘿）是将"子弹头"作为标记的一部分。

<li><img src="important.gif" alt="Something" title="Hey! Useful info!" /> Test</li>

Answer 2

jQuery('li.important').mouseover();

Answer 3

我没有看到你提到的第一个要点的问题：

http://jsfiddle.net/xrGqk/2/

测试在Chrome、FF、IE7中设置自定义图像LI的标题属性。将鼠标悬停在LI上的图像上，标题将在所有三个浏览器中弹出。

onmouseover似乎也工作得很好：

http://jsfiddle.net/xrGqk/4/

当您将鼠标悬停在LI自定义图像项目符号上时，应该会发出警报。

试试这些，看看它们是否适合你。如果是这样，请考虑发布给您带来问题的代码。