Get started with jump.js CDN
MIT licensed
Jump.js: Lightweight library for smooth page navigation and anchor jumping.
Tags:- scroll
Stable version
Copied!
How to start using jump.js CDN
<!DOCTYPE html>
<html>
<head>
<title>Get started with jump.js CDN - cdnhub.io</title>
<link rel="stylesheet" href="styles.css">
<script src="https://cdn.cdnhub.io/jump/1.0.2/jump.min.js"></script>
</head>
<body>
<button id="toTop">Scroll to top</button>
<button id="toBottom">Scroll to bottom</button>
<div id="content" style="height: 100vh;">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed euismod, nunc quis bibendum rhoncus, nisi lorem egestas odio, ut aliquam odio nisi quis nibh. Nullam id felis et ipsum bibendum ultrices.</p>
<p>Nullam id felis et ipsum bibendum ultrices. Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p>
</div>
<script>
document.addEventListener('DOMContentLoaded', function() {
const toTopButton = document.getElementById('toTop');
const toBottomButton = document.getElementById('toBottom');
const contentElement = document.getElementById('content');
const jump = new Jump();
toTopButton.addEventListener('click', function() {
jump.scrollTo(0, 0);
});
toBottomButton.addEventListener('click', function() {
const height = contentElement.offsetHeight;
jump.scrollTo(0, height);
});
});
</script>
</body>
</html>
Copied!
Copied!
Copied!