Question

如何在鼠标悬停时单独点亮li个标签，所有li标签一次亮起

 $(document).ready(function(){
  $("li").mouseover(function(){
   $("li").css("background-color","yellow");
 });
  $("li").mouseout(function(){
  $("li").css("background-color","lightgray");
  });
});

HTML：

 <ul class="menu">
 <li>Bookmarks</li>
 <li>Something</li>
 <li>BUMPER STICKERS</li>
 <li>CARBONLESS FORMS</li>
 <li>CD JACKETS</li>
 <li>DIE CUT/CUSTOM STICKERS</li>
 <li>DOOR HANGERS</li>
 <li>ENVELOPES</li>
 <li>FOLDERS</li>
 <li>LETTERHEADS</li>
 <li>RECTANGULAR STICKERS</li>
 <li>ROUND STICKERS</li>
 <li>STATIC CLING </li>
 <li>TABLE TENTS</li>
 <li>VINYL BANNERS</li>
<li>WINDOW STICKERS</li>

</ul>

Answer 1

演示：http://jsfiddle.net/whZYD/

 $(document).ready(function(){
  $("li").mouseover(function(){
   $(this).css("background-color","yellow");
 });
  $("li").mouseout(function(){
  $(this).css("background-color","lightgray");
  });
});

Answer 2

为什么不使用CSS？

li {
    background-color: lightgray;
}

li:hover {
    background-color: yellow;
}

Answer 3

尝试：

$(document).ready(function () {
 $("li").hover(function () {
     $(this).css("background-color", "yellow");
 }, function () {
     $(this).css("background-color", "lightgray");
 });
});

或者只是使用Css：

li {
  background-color: lightgray;
}

li:hover {
  background-color: yellow;
}

Answer 4

代码：

    #page li:hover a:visited
    {
    background-color:green;
    }

请看下面的链接：

li:hover a visited colour

http://htmlbook.ru/css/hover

如何让li标签单独点亮

4 个答案: