<!doctype html>
<html>
<head>
<meta charset="gb2312" />
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>
<link rel="stylesheet" type="text/css" href="css/jquery.paperfold.css"/>
<script src="js/jquery.1.7.2.min.js"></script>
<script src="js/modernizr.custom.71147.js"></script>
<script src="js/jquery.paperfold.js"></script>
<title>jQuery列表展开折叠特效代码 - 网页模板</title>
</head>
<body>
<div class="container">
<div>
<h3>Demo</h3>
<div class="panel">
<button class="btn btn-default paperfold-toggle">点击切换</button>
</div>
<div class="paperfold panel">
<ol>
<li>
<p>运动库网站jQuery焦点图.</p>
</li>
<li>
<p>jQuery实用幻灯片特效代码.</p>
</li>
<li>
<p>jQuery带微信的返回顶部代码.</p>
</li>
<li>
<p>jQuery纵向定位滚屏特效代码.</p>
</li>
<li>
<p>缩略图向上突起jQuery焦点图.</p>
</li>
<li>
<p>缩略图向上突起jQuery焦点图.</p>
</li>
</ol>
</div>
</div>
</div>
<script>
$('.paperfold').paperfold({
'toggle': $('.paperfold-toggle'),
'folds': 2
});
</script>
<div style="text-align:center;clear:both">
<p>适用浏览器:360、FireFox、Chrome、Safari、Opera、傲游、搜狗. 不支持IE8、世界之窗。</p>
<p>来源:<a href="http://www.moobnn.com/" target="_blank">网页模板</a></p>
</div>
</body>
</html>