scroll-target
<scroll-target>: Wrap things and make visible
[ This description is mirrored from README.md at github.com/fluorumlabs/scroll-target on 2019-05-10 ]
<scroll-target>
<scroll-target> is a really simple web component for making scrolling easier.
ll you need to do is to wrap the content you want to scroll to and call ensureVisibility()
:
<button onclick="document.getElementById('target').ensureVisibility()">Click me!</button>
...
<scroll-target id="target">
<h2>I'm the content you want to see</h2>
<p>...</p>
</scroll-target>
Properties
<scroll-target top-offset="<offset-in-pixels>">
top-offset
defines a space that should be reserved for fixed top menu when scrolling. 0
by default. Can be changed in runtime by calling scrollTargetElement.setTopOffset(...)
.
Methods
scrollTargetElement.setTopOffset(<offset-in-pixels>);
setTopOffset
defines a space that should be reserved for fixed top menu when scrolling. Can be set via top-offset
attribute.
scrollTargetElement.ensureVisibility(<delay-in-milliseconds>);
ensureVisibility
scrolls to make the wrapped content visible. If optional <delay-in-milliseconds>
is specified, scrolling will be delayed by specified amount of time.
Links
Compatibility
Was this helpful? Need more help?
Leave a comment or a question below. You can also join
the chat on Discord or
ask questions on StackOverflow.
Version
Dependencies
- smoothscroll#^0.3.6
- Released
- 2019-04-04
- Maturity
- IMPORTED
- License
- Apache License 2.0
Compatibility
- Framework
- Polymer 1.0+
- Polymer 2.0+
- Browser
- Browser Independent
scroll-target - Vaadin Add-on Directory
I'm the content you want to see
...