scrollup
scrollup copied to clipboard
markgoodyear
data-api support
@cemo As the scroll element is generated, I can't see an advantage of using data-api's. Are you thinking to be able to create your own element and use data-api?
I was considering to add necessary data attributes to body and listen one with jquery.
@cemo Do you have an example of how you could see this in action? I may add this into the roadmap, likely in v3.
@markgoodyear The advantage of the data-api is no need to write JS-code at all to connect your plugin.
For example it could be like this —
<body data-scroll-up="300">
<script ... />
</body>
Now you have to write small piece of JS to connect it.
So, I also agree that it's great feature to implement.
The issue here is handling all the options, I can see two options after experimenting:
Option 1
<a class="scroll-up" title="Back to the top"
data-scrollup="300"
data-scrollup-speed="300"
data-scrollup-easing="linear"
data-scrollup-animation="fade"
data-scrollup-animation-speed="200"
data-scrollup-target=".some-elem-to-scroll-back-to">Text / Image / Icon</a>
So this would be a full data-api scenario, with data-attributes for every option. Allowing the user to include the actual markup on page, rather than the plugin inject it allows more control and less required options.
Option 2
<a class="scroll-up" title="Back to the top"
data-scrollup='{
"offset": 300,
"scrollSpeed": 300,
"easing": "linear",
"animation": "fade",
"animationSpeed": 200,
"scrollTarget": ".some-elem-to-scroll-back-to"
}'>Text / Image / Icon</a>
Similar to above, but using a single data-attribute and configuring via a JSON object inside.
The animation options may not even need to be there if we utilise CSS animations more.
What are your thoughts?
Definitely first option will be my choice. IMHO the second one is mixing html with javascript which is pretty ugly.
Cool, thanks guys. This will probably wait until v3. I intend to re-write from scratch, dropping the need for jQuery. Hopefully try get it out in the next week, or at least a development version to test.