jQuery菜单选中代码,响应鼠标背景变色效果

[复制链接]
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=gbk" />
  5. <title>一个jquery菜单“选中”效果_烈火网</title>
  6. <style type="text/css">
  7. a{color:#666;text-decoration:none}
  8. ul {list-style-type:none;margin:0}
  9. li{border:1px solid #F69;width:120px}
  10. .selecthover{background-color:#F69}
  11. .lihover{background-color:#F69}
  12. </style>
  13. </head>
  14. <body>
  15. <ul id="Sub_Links">
  16. <li>
  17. <a href="#">板材</a>
  18. </li>
  19. <li>
  20. <a href="#">马赛克</a>
  21. </li>
  22. <li>
  23. <a href="#">拼花</a>
  24. </li>
  25. <li>
  26. <a href="#">台面板</a>
  27. </li>
  28. <li>
  29. <a href="#">洗手盆</a>
  30. </li>
  31. <li>
  32. <a href="#">壁炉</a>
  33. </li>
  34. <li>
  35. <a href="#">异形</a>
  36. </li>
  37. </ul>
  38. <br/>
  39. <ul id="Sub_Links">
  40. <li>
  41. <a href="#">板材</a>
  42. </li>
  43. <li>
  44. <a href="#">马赛克</a>
  45. </li>
  46. <li>
  47. <a href="#">拼花</a>
  48. </li>
  49. <li>
  50. <a href="#">台面板</a>
  51. </li>
  52. <li>
  53. <a href="#">洗手盆</a>
  54. </li>
  55. <li>
  56. <a href="#">壁炉</a>
  57. </li>
  58. <li>
  59. <a href="#">异形</a>
  60. </li>
  61. </ul>
  62. <script type="text/javascript" src="js/jquery-1.js"></script>
  63. <script>
  64. $("li").click(function(){
  65. $(this).addClass("selecthover").siblings().removeClass("selecthover");
  66. }).hover(function(){
  67. $(this).addClass("lihover");
  68. },function () {
  69. $(this).removeClass("lihover");
  70. })
  71. </script>
  72. </body>
  73. </html> <div style="text-align:center;margin:30px 0 0 0;"><hr style="color:#999;height:1px;">如不能显示效果,请按Ctrl+F5刷新本页,更多网页代码:<a href='http://www.dtyuanma.com/' target='_blank'>http://www.dtyuanma.com/</a></div>
复制代码


回复

使用道具 举报

精彩评论11

我也来看了,很不错,收藏了












微信号
微信号出售
买卖微信号
回复 支持 反对

使用道具 举报

非常高兴遇到这么好的帖子 谢谢












回复 支持 反对

使用道具 举报

也是支持,我代表大家顶你了












回复 支持 反对

使用道具 举报

好!谢谢!












回复 支持 反对

使用道具 举报

我反复看了多遍,好帖,得支持












麻城论坛0713m.com/
回复 支持 反对

使用道具 举报

谢谢!楼主提供!好样的












回复 支持 反对

使用道具 举报

我也想了解,请大家都说说












专业代发帖子,发帖宣传,论坛发帖,网络推广,外链代发。
联系QQ121576792           微信号:121576792
1. 论坛:发帖·顶贴·盖楼·维护·回复·评论·沉帖·负面压制·新闻评论·置顶加精等等~
2. 微博:加粉·直发·转发·评论·转评·话题·阅读量·投票·收藏·点赞·等等~
3. 微信:加粉·转发·点赞·阅读量·分享·投票·等等~
4. 点击:帖子点击率·视频点击率·博客点击率·网站IP·等等~
5. 视频:评论·点赞·等等~
6. sns :转发·评论·等等~
7. 问答:百度知道·360问答·搜搜问答·等等~
8. 投票:各种网络评选投票·等等~
9. 博客:博客发帖·评论·高等级博客发帖
10.qq群:各类群发
11.贴吧 :加关注·包月签到·包年签到·提高贴吧排名

承接各类网络任务!人手多,老手多,多年执行经验,全年无休假。

回复 支持 反对

使用道具 举报

支持~~支持~~












北京外籍模特公司 enjoyfree8.com
回复 支持 反对

使用道具 举报

哪 里 有乙 o 醚 三 唑 仑 买 ▇★加【文老板QQ86450585电话186-8716-4830灵药世家】诚信经营▇、恪守信誉”的核心价值观,为客户提供多样、安全、稳定、放心的产品。
回复 支持 反对

使用道具 举报

快速回复 返回顶部 返回列表