pageslides
v1.1.0
Published
A free alternative to fullPage.js for creating full-page scrolling websites.
Downloads
5
Readme
PageSlides
PageSlides is a free alternative to fullPage.js for creating full-page scrolling websites. It provides smooth transitions between sections and supports mouse wheel, keyboard, and touch navigation.
Features
- Full-page scrolling with smooth transitions.
- Keyboard arrow and touch swipe support.
- Customizable scrolling speed and options.
- Debounced event handling for performance.
Installation
You can install PageSlides via npm:
npm install pageslidesUsage
To use PageSlides, include the library in your HTML file and initialize it. Below is an example of a basic setup:
HTML
Create your HTML file with the following structure:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>PageSlides Demo</title>
</head>
<body>
<div class="section" style="background: lightcoral;">Section 1</div>
<div class="section" style="background: lightseagreen;">Section 2</div>
<div class="section" style="background: lightblue;">Section 3</div>
<script src="{path/to/pageslides/bundle.js}"></script>
<script>
new PageSlides();
</script>
</body>
</html>Customization
You can customize the scrolling behavior by passing options when initializing PageSlides:
new PageSlides({
scrollingSpeed: 1000, // Adjust the scrolling speed (default is 700ms)
});Contributing
Contributions are welcome! Please fork the repository and submit pull requests for any enhancements or bug fixes.
License
This project is licensed under the GNU GENERAL PUBLIC LICENSE.