手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >jquery 简单导航实现代码
jquery 简单导航实现代码
摘要:复制代码代码如下:$(function(){$("li").hover(function(){$(this).addClass("ho");...

复制代码 代码如下:

<script type="text/javascript" src="js/jquery.min.js"></script>

<script type="text/javascript">

$(function(){

$("li").hover(function(){

$(this).addClass("ho");

},

function(){

$(this).removeClass("ho");

});

$("li").click(function(){

$(this).removeClass("ho").addClass("xiaoshi").siblings().removeClass("xiaoshi");

});

})

</script>

<style type="text/css">

li{background-color:#099; float:left; width:50px; height:25px; margin-left:1px; list-style:none;}

.xiaoshi{background-color:#FF0;}

.ho{background-color:#F00;}

</style>

</head>

<body>

<div>

<ul>

<li>我第1</li>

<li>我第2</li>

<li>我第3</li>

<li>我第4</li>

<li>我第5</li>

<li>我第6</li>

</ul>

</div>

</body>

【jquery 简单导航实现代码】相关文章:

jQuery实现html表格动态添加新行的方法

基于jquery实现下拉框美化特效

简单的防盗链功能代码(iframe)

javascript用函数实现对象的方法

jQuery 遍历函数详解

jQuery聚合函数实例

js实现异步循环实现代码

jQuery实现延迟跳转的方法

nodejs怎么简单实现中英文翻译

jQuery实现表格行上移下移和置顶的方法

精品推荐
分类导航