jquery tab切换效果,css样式自己定义下即可。

<!doctype html>
<html>
<head >
<meta charset="utf-8">

<title>jQuery tab切换</title>

<style>
	.inform-text{display:none;}
	.inform-text.show{display:block;}
</style>


<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>

</head>
<body>

<div class="mobile-wrap center mobile-wrap-mb">


		<div class="inform">			
			<div class="inform-list">
				<ul>
					<li class="acti">个人信息</li>
					<li>修改资料</li>					
				</ul>
			</div>
			<div class="inform-text show">
				dddddd
			</div>
			<div class="inform-text">
				sss
			</div>	
		</div>


</div>

<script type="text/javascript">
	$('.inform-list ul li').click(function(){
		var n=$(this).index();
		$(this).addClass('acti').siblings().removeClass('acti');
	
		//$('.inform-text').fadeOut();
		//$('.inform-text').eq(n).fadeIn();
		
		$('.inform-text').hide();
		$('.inform-text').eq(n).show();

	})
</script>
</body>
</html>

 


关注公众号,了解更多it技术(it问答网

发表评论

电子邮件地址不会被公开。