For some project I included Jquery animations in web sites. There are many Jquery scripts on Internet but, of course, not all of them satisfy your requirements.
When creating the animation, the first thing I do is choosing the script animation that can be useful as basis, creating a sort of demo and start to understand the code in order to be changed.
What I don’t see in several scripts is the absence of thinking for web designers, I mean people that know only CSS and html and they are interested on how to modify the classes name or id because they already exist in the website. Usually indeed the names or id have prefix but these variables are spread around the code, instead of being written once.
If have to work with HTML 5, I still don’t know if using data-attributes it is a good idea. In caniuse.com I can see that Internet Explorer 11 doesn’t fully support data attributes and Internet Explorer is still a big player in the browser puzzle, on the other side:
- Jquery 2.0, which provide support from IE9 onward (major media queries are supported by IE9), has .data or .attr functions.
- Further there are framework like AngularJS that make use of data attributes, working per injection without add/repeating any css/id which make me think that I should start to explore it since recently they start to make use of animations.