1.在页面引用 css样式 如下: 需要下载 css样式
<link rel="stylesheet" href="css/jquery.fullPage.css">
2.在页面引入js文件 如下: 需要下载 js
<script src="js/jquery-1.8.3.min.js"></script> <script src="js/jquery.fullPage.js"></script>
3.编写页面:
<div id="dv">
<div class="section">
<h3><img src="imgs/flv01.jpg" alt=""/></h3>
</div>
...省略其它div
</div>
4.编写jq代码如下:
<script>
$(document).ready( function () {
$('#dv').fullpage();
});
</script>
完整代码如下: 绝对 10分钟以内搞定
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<style>
img{ width: 100%; }
</style>
<link rel="stylesheet" href="css/jquery.fullPage.css">
</head>
<body>
<div id="dv">
<div class="section">
<h3><img src="imgs/flv01.jpg" alt=""/></h3>
</div>
<div class="section">
<h3><img src="imgs/flv02.jpg" alt=""/></h3>
</div>
<div class="section">
<h3><img src="imgs/flv03.jpg" alt=""/></h3>
</div>
<div class="section">
<h3><img src="imgs/flv04.jpg" alt=""/></h3>
</div>
</div>
</body>
<script src="js/jquery-1.8.3.min.js"></script>
<script src="js/jquery.fullPage.js"></script>
<script>
$(document).ready(function () {
$('#dv').fullpage();
});
</script>
</html>