Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

data-api support #23

Open
cemo opened this issue May 26, 2014 · 8 comments
Open

data-api support #23

cemo opened this issue May 26, 2014 · 8 comments
Labels
feature
Milestone
v3

Comments

@cemo
Copy link

cemo commented May 26, 2014

It can be great to have data-api support... What do you think?
@markgoodyear
Copy link
Owner

@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?

@cemo
Copy link
Author

cemo commented Jun 28, 2014

I was considering to add necessary data attributes to body and listen one with jquery.

@markgoodyear
Copy link
Owner

@cemo Do you have an example of how you could see this in action? I may add this into the roadmap, likely in v3.

@sergeyzwezdin
Copy link

@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.

@markgoodyear
Copy link
Owner

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?

@cemo
Copy link
Author

cemo commented Oct 5, 2014

Definitely first option will be my choice. IMHO the second one is mixing html with javascript which is pretty ugly.

@sergeyzwezdin
Copy link

Agree with @cemo — first option is much better.

@markgoodyear
Copy link
Owner

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.

@markgoodyear markgoodyear added this to the v3 milestone Oct 6, 2014
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
feature
Projects
None yet
Milestone
v3
Development

No branches or pull requests
3 participants
@cemo @markgoodyear @sergeyzwezdin