用户注册



邮箱:

密码:

用户登录


邮箱:

密码:
记住登录一个月忘记密码?

发表随想


还能输入:200字
云代码 - javascript代码库

标签切换

2016-05-30 作者: lijinbo举报

[javascript]代码库

<style type="text/css">
	*{padding:0px;margin:0px;}
	#nav{display:block;}
	.clear{clear:both;}
	ul li{list-style:none;
	       float:left;
		   margin:0 5px;
		   width:100px;
		   }
	#content div{
	          display:none;
			  width:300px;
			  height:100px;
			  background:#eee;
			  }	  
   #content div.cur{
         display:block;
      }	
#nav .cur a{
  color:#f00;
  }	  
	</style>
$("document").ready(function(){
						$("#nav li").click(function(){
								
								var i=$(this).attr('date-i')
								$("#nav li").removeClass('cur');
								$(this).addClass('cur');
								$("#content div").removeClass('cur');
								$("#a_"+i).addClass('cur');
												})	 
							 })
<body>
	<ul id="nav">
		<li class="cur" data-i='1'><a href="javascript:void(0);">jquery</a></li>
		<li data-i='2'><a href="javascript:void(0);">js</a></li>
		<li data-i='3'><a href="javascript:void(0);">linus</a></li>
	</ul>
	<div class="clear"></div>
	<div id="content">
		<div id="a_1" class="cur">jquery</div>
		<div id="a_2">js</div>
		<div id="a_3">linus</div>
	</div>	
</body>


网友评论    (发表评论)


发表评论:

评论须知:

  • 1、评论每次加2分,每天上限为30;
  • 2、请文明用语,共同创建干净的技术交流环境;
  • 3、若被发现提交非法信息,评论将会被删除,并且给予扣分处理,严重者给予封号处理;
  • 4、请勿发布广告信息或其他无关评论,否则将会删除评论并扣分,严重者给予封号处理。


扫码下载

加载中,请稍后...

输入口令后可复制整站源码

加载中,请稍后...