One page scrolling, written in vanilla JavaScript with CSS transitions.
- Keyboard navigation
- Mouse wheel navigation
- Bullet navigation
- Responsive
Works with all modern browsers that support CSS3. In the next version IE8 en IE9 will be supported.
Scroll through the different sections either using the keyboard, mouse wheel or bullet navigation on the right.
<div id="mask">
<nav>
<ul>
<li data-section="0"></li>
<li data-section="1"></li>
<li data-section="2"></li>
<li data-section="3"></li>
</ul>
<div id="container">
<section>
Section 1
</section>
<section>
Section 2
</section>
<section>
Section 3
</section>
<section>
Section 4
</section>
</div>
</div>
<script src="scripts/lescroll.min.js"></script>Simply add a new
If you want to link a button or other element to a certain section you can use the .addEvent function
To add a class use:
leScroll.addEvent('.arrowdown', 1);
To add an ID use:
leScroll.addEvent('#clickme', 0);