您的位置：首页 > 其它

使用accordion插件实现页面中多区域的折叠操作8－4

2014-09-03 11:36 736 查看
accordion 参数说明：http://blog.csdn.net/smeyou/article/details/6752469

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>使用accordion插件实现页面中多区域的折叠操作</title>
<script type="text/javascript" src="lib/jquery-2.1.1.js"></script>
<script type="text/javascript" src="lib/jquery-ui.js"></script>
<style type="text/css">
	body{font-size:13px}
	.divFrame{width:500px;}
	.divFrame h3{padding:5px;font-size:12px;border:solid 1px #ccc;background-color:#eee}
	.divFrame .divOpt{padding:5px;border:solid 1px #eee}
</style>
<script type="text/javascript">
	$(function(){
		$("#accordion").accordion();
	})
</script>
</head>
<body>

	<div class="divFrame">
		<div id="accordion">
			<h3><a href="#">Section 1</a></h3>
			<div class="divOpt">
				<p>Item 1</p>
			</div>
			<h3><a href="#">Section 2</a></h3>
			<div class="divOpt">
				<p>Item 2</p>
			</div>
			<h3><a href="#">Section 3</a></h3>
			<div class="divOpt">
				<p>Item 3</p>
			</div>
			<h3><a href="#">Section 4</a></h3>
			<div class="divOpt">
				<p>Item 4</p>
			</div>
		</div>
		
	</div>
	
</body>
</html>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航