Question

所以我无法弄清楚这一点。如果您转到此链接：http://www.pandashan.com/us/，您会发现它会将鼠标悬停在所选链接上，但背景图片为：http://www.pandashan.com/us/design3/img/menu.png

当它徘徊时，如何只显示链接区域，在图像中，完整的导航栏是彩色的？

希望你明白我在说什么。

谢谢

Answer 1

他们在CSS中使用背景位置悬停

header nav ul li.home:hover {width:104px; background-position: 0px -86px;}
header nav ul li.register:hover {width:107px; background-position: -113px -86px;}
header nav ul li.account:hover {width:107px; background-position: -113px -86px;}
header nav ul li.connect:hover {width:170px; background-position: -220px -86px;}
header nav ul li.divider:hover {width:233px; background-position: -390px -86px;}
header nav ul li.forum:hover {width:92px; background-position: -623px -86px;}
header nav ul li.bugtracker:hover {width:133px; background-position: -715px -86px;}
header nav ul li.boutique:hover {width:120px; background-position: -848px -86px;}

如何仅对选定的导航进行悬停效果

1 个答案: