鼠标移到导航上面 当前的LI变色 处于当前的位置

鼠标移到导航上面当前的LI变色处于当前的位置,广泛应用于当前导航。点击这里查看效果以下是源代码:1234鼠标移到导航上面当前的LI变色处于当前的位置-柯乐义51314152

大家好,又见面了,我是全栈君,今天给大家准备了Idea注册码。

全栈程序员社区此处内容已经被作者隐藏,请输入验证码查看内容
验证码:
请关注本站微信公众号,回复“验证码”,获取验证码。在微信里搜索“全栈程序员社区”或者“www_javaforall_cn”或者微信扫描右侧二维码都可以关注本站微信公众号。

鼠标移到导航上面 当前的LI变色 处于当前的位置,广泛应用于当前导航。

点击这里查看效果

以下是源代码:

 1 <html>
 2 <head>
 3 <meta http-equiv="Content-Type" content="text/html; charset=utf8">
 4 <title>鼠标移到导航上面 当前的LI变色 处于当前的位置-柯乐义</title>
 5 <style type="text/css">
 6 ul,li{list-style:none;}
 7 #nav li{display:inline-block;margin:0 5px;background:#ccc;padding:0 10px; line-height:24px;font-size:12px;float:left;}
 8 #nav li.h_nav_over{background:red;color:#fff;}
 9 #nav li.h_nav_over a{color:#fff;}
10 a{text-decoration:none;}
11 
12 </style>
13 <script type="text/javascript" src="http://keleyi.com/keleyi/pmedia/jquery/jquery-1.10.2.min.js"></script>
14 
15 <script type="text/javascript">
16 $(function(){
17 $("#nav>ul>li").mouseover(function(){
18         $("#nav>ul>li").each(function(i){
19             $(this).removeClass("h_nav_over");
20         });
21         $(this).addClass("h_nav_over");
22     }).mouseout(function(){
23         $(this).addClass("h_nav_over");
24     });
25 });
26 </script>
27 
28 </head>
29 <body>
30 <div id="nav">
31      <ul>
32         <li><a  href="http://keleyi.com" >首页</a></li><li><a  href="http://keleyi.com/a/bjac/2208fcb8.htm" >品牌商机</a></li>
33         <li><a  href="http://keleyi.com/a/bjac/ec2s9a4n.htm" >精品商机</a></li><li><a  href="http://keleyi.com/a/bjac/m9p0je8s.htm" >最新商机</a></li>
34         <li><a  href="http://keleyi.com/a/bjac/iphgrtqm.htm" >投资考察会</a></li><li><a  href="http://keleyi.com/a/bjac/kjsrt3b0.htm" >在线交流区</a></li>
35      </ul>
36 </div>
37 </body>
38 </html>

 

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/120801.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • sqlserver临时表详解_怎么把临时表的数据更新到正式表

    sqlserver临时表详解_怎么把临时表的数据更新到正式表[转自]http://zhengweisincere.blog.163.com/blog/static/498446492009625749522/在SQLServer的性能调优中,有一个不可比面的问题:那就是如何在一段需要长时间的代码或被频繁调用的代码中处理临时数据集?表变量和临时表是两种选择。记得在给一家国内首屈一指的海运公司作SQLServer应用性能评估和调优的时候就看到过

    2022年8月21日
    3
  • 脚本是什么?[通俗易懂]

    脚本是什么?[通俗易懂]初次接触“脚本”一词并不知道这一听似非常高大上的东西是什么,尔后逐渐接触,虽有了解,但也没有仔细地总结和思考过,今日百度了一下,在此小小总结。“脚本”其实就是一段代码,一个程序。这与我们学习C语言时,写的第一个“helloworld”显示程序没有太大的区别,那为什么这个向程序之神打招呼的“helloworld”程序我们不称其为脚本呢?因为“脚本”有这些特别之处:1、脚本语法比较简单…

    2025年7月26日
    1
  • PID控制算法的C语言实现

    PID控制算法的C语言实现前言最近在学习PID算法,在了解了算法的套路以后,就要进行实验。如何用C语言实现呢?在网络搜索发现了一篇很好的博客,不过里面的数据又臭又长。在这里转载过来,重下新整理了一下。(原文链接)整理中发现,原文参考的原理在工业应用中PID及其衍生算法是应用最广泛的算法之一,是当之无愧的万能算法,如果能够熟练掌握PID算法的设计与实现过程,对于一般的研发人员来讲,应该是足够应对一般研发问题了,而难能可…

    2022年6月6日
    26
  • 13 万字 C 语言从入门到精通保姆级教程2021 年版

    13万字C语言保姆级教程,从入门到精通。

    2022年4月9日
    27
  • pycharm为什么有中文就运行不了_pycharm为什么不能运行

    pycharm为什么有中文就运行不了_pycharm为什么不能运行1.下载并解压JBR(链接:link)我选的是左上角第一个2.替换pycharm安装文件里的jbr文件3.重启pycharm即可JBR链接地址:https://confluence.jetbrains.com/pages/viewpage.action?pageId=173178989

    2022年8月29日
    2
  • mapstate辅助函数(辅助函数是什么)

    当一个组件需要获取多个状态时候,将这些状态都声明为计算属性会有些重复和冗余。为了解决这个问题,我们可以使用mapState辅助函数帮助我们生成计算属性,让你少按几次键:mapState是什么?表面意思:mapState是state的辅助函数.这么说可能很难理解抽象形容:mapState是state的语法糖,这么说可能你还想骂我,因为你根本不了解什么叫做语法糖,事实上我说的…

    2022年4月14日
    32

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号