Discover the best pagepiling websites created by professional designers. Get inspired and start planning your perfect pagepiling web design today!

Using PagePiling with Webflow is simple.

- Start by creating a DIV with ID 'pagepiling'
- Within the DIV create several sections with the class 'section'
- Make these sections height:100vh
- Add this code inside <head> tag
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/pagePiling.js/1.5.6/jquery.pagepiling.css" />

- Add this code before <body> tag
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pagePiling.js/1.5.6/jquery.pagepiling.min.js"></script>
<script>
$(document).ready(function() {
	$('#pagepiling').pagepiling();
});
</script>

You can customize this more, eg with anchors, scrolling speeds and menu navigation by looking at the GitHub here https://github.com/alvarotrigo/pagePiling.js/

Discover pagepiling websites built by the Webflow community

Discover pagepiling websites built by the Webflow community