In today’s ScrollMagic tutorial we will trigger our GreenSock animation based on the scroll position.
Best jQuery Animation Plugins & Tutorials with Demo
Stackbox is a jQuery plugin for creating stackable modal boxes. It’s easy to customize using CSS / LESS.For animations to work, you need to include Animate.css or some other CSS3 keyframe animation library.
Reveal-it.js is a jQuery plugin that gradually reveals text from left to right to produce a fade-in effect.
- Full-screen video and image backgrounds
- Google Fonts support
- Multiple screens support
- YouTube & HTML5 videos
- Launch a preview from the editor
Splash Screen Pro uses a 12-column grid system, similar to Bootstrap’s grid system.Everything in the editor is drag and drop. You can create columns and rows and reposition them however you like.
Today we’d like to explore some of these click/touch effects, using different animations. While there are many kinds of animations that can be done to provide feedback, we’re particularly interested in the subtle “tap-like” effects.
A set of subtle effects for click or touch interactions inspired by the visualization of screen taps in mobile app showcases. The effects are done with CSS animations mostly on pseudo-elements.
Visualizers made entirely from DOM elements and CSS3 Animations and Transforms.There is no SVG, Canvas, WebGL, or visual plug-in used. It takes quite a bit of tweaking to reduce compositing and optimize rendering layers but this is the kind of stuff CSS can do now a days.
A call-to-action button that animates and turns into a full-size modal window.Modal windows are used to display related content, by hiding temporarily the main content. If we imagine our web page as layers distributed along the z-axis, modal windows are on top.
The final result is powered by a combination of CSS transition and transformations, jQuery and Velocity.