fullPage.js 是一个基于 jQuery 的全屏滚动插件，它能够帮助开发者轻松创建漂亮的全屏滚动网站。本文将介绍 fullPage.js 的使用方法，包括安装、初始化和常用配置等。
安装
要使用 fullPage.js，首先需要在项目中安装该 npm 包。可以通过以下命令安装：
npm install fullpage.js
初始化
安装完毕后，在 HTML 中引入 jQuery 和 fullPage.js：
<!-- 引入 jQuery --> <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script> <!-- 引入 fullPage.js --> <script src="./node_modules/fullpage.js/dist/fullpage.min.js"></script>
接着，在 JavaScript 中进行初始化：
$(document).ready(function() {
$('#fullpage').fullpage();
});这里的 #fullpage 是你想要应用 fullPage.js 的元素的 ID。当你调用 .fullpage() 方法时，fullPage.js 将会对该元素进行初始化，并自动添加一些必要的 DOM 元素。
配置
fullPage.js 提供了许多常用的配置选项，以及一些高级选项。下面是一些常用的配置选项：
-- -------------------- ---- -------
-------------------------
-- ---- ------- -----
-------------- ----------- ---------- ---------- ------------- -----------
-- -- ------- -------
----------------- -----
-- ------------- ----------- - -----
------------------- --------
-- ------
--------------- -----
-- -----------
------------- -----
-- ---- ------- -----
-------- ------------- ------------- ---------- ---------- ------------
-- ------
--------------- ----
-- ------
---------- -------------------- -------
-- --------- ------- ------
-------------------- - - ----- - - ---------
-
---更多的配置选项可以查看官方文档。
示例代码
下面是一个简单的 fullPage.js 示例代码：
-- -------------------- ---- -------
--------- -----
------
------
------------------ ------------
---- -- ------ ---
------- ----------------------------------------------------------------------------
---- -- ----------- ---
------- ---------------------------------------------------------------
-------
-- ---- ------- --- --
-------- -
----------- -------
---------- ----
------ ------
-
-- ---- ------- ----- --
--------- -
----------------- --------
-
--------- -
----------------- --------
-
--------- -
----------------- --------
-
--------- -
----------------- -----------
-
--------- -
----------------- --------
-
--------
-------
------
---- --------------
---- --- ---
---- --------------- --------------------- -------
---- --- ---
---- --------------- --------------------- -------
---- --- ---
---- --------------- --------------------- -------
---- --- ---
---- --------------- --------------------- -------
---- --- ---
---- --------------- --------------------- -------
------
--------
-----------------
- ----------------------------------------------------------- --------
----------------------------------------------------------------------------------