Skip to content
Snippets Groups Projects
Commit 7b4ecfb8 authored by Daniel Kurowski's avatar Daniel Kurowski
Browse files

Added scrollTo*() methods to integration test

parent 5f64a327
Branches
Tags
1 merge request!8Resolve "Expose manual scrollTo*() methods to public API"
Hide whitespace changes
Inline Side-by-side
src/integrationTest.html
+ 27
− 1
View file @ 7b4ecfb8
...@@ -11,11 +11,25 @@ ...@@ -11,11 +11,25 @@
scrollOnLoad: true, scrollOnLoad: true,
scrollOnLinkClick: true, scrollOnLinkClick: true,
}); });
document.addEventListener('DOMContentLoaded', () => {
document.getElementById('scrollToElement').addEventListener('click', (event) => {
event.preventDefault(); // prevent jump to top as there is `#` in `href` attribute
SmoothScroll.scrollToElement(document.getElementById('footer'));
});
document.getElementById('scrollToOffset').addEventListener('click', () =>
SmoothScroll.scrollToOffset(5000));
document.getElementById('scrollToTarget').addEventListener('click', () =>
SmoothScroll.scrollToTarget('#item3'));
});
</script> </script>
<style type="text/css"> <style type="text/css">
body { body {
margin: 0 auto; margin: 0 auto;
max-width: 40rem; max-width: 40rem;
padding-bottom: 150vh;
} }
.goToTop { .goToTop {
...@@ -34,7 +48,6 @@ ...@@ -34,7 +48,6 @@
</style> </style>
</head> </head>
<body> <body>
<!-- @todo: improve this file -->
<div id="nahoru"></div> <div id="nahoru"></div>
<a href="#item1">Item1</a> <a href="#item1">Item1</a>
...@@ -42,6 +55,9 @@ ...@@ -42,6 +55,9 @@
<a href="#item3">Item3</a> <a href="#item3">Item3</a>
<a href="#item4">Item4</a> <a href="#item4">Item4</a>
<a href="#item5">Item5</a> <a href="#item5">Item5</a>
<a href="#" id="scrollToElement">Scroll to element</a>
<button type="button" id="scrollToOffset">Scroll to 5000px top offset</button>
<a href="#" id="scrollToTarget">Scroll to target</a>
<div> <div>
<div id="item1"> <div id="item1">
...@@ -222,5 +238,15 @@ ...@@ -222,5 +238,15 @@
Go to top Go to top
</a> </a>
</div> </div>
<div id="footer">
<p>
Footer
</p>
<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam ornare wisi eu metus. Pellentesque ipsum.
</p>
</div>
</body> </body>
</html> </html>
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment