fullPage.js 是一个基于 jQuery 的插件,它能够很方便、很轻松的制作出全屏网站。
用法:
1、引入jquery
2、引入fullPage
3、每个section代表一屏
4、js启动:
$(function(){ $('#dowebok').fullpage(); });
完整实例:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script src="js/jquery-1.8.3.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/fullPage.js/2.7.2/jquery.fullPage.js"></script> </head> <body> <div id="fullpage"> <div class="section">Some section one</div> <div class="section active">Some section two</div> <div class="section">Some section three</div> <div class="section">Some section four</div> </div> <script> $(document).ready(function() { $('#fullpage').fullpage({ sectionsColor: ['#1bbc9b', '#4BBFC3', '#7BAABE', '#f90'] }); }); </script> </body> </html>
详情: