Best jQuery CSS2 / CSS3.0 Plugins & Tutorials with Demo

    Multibox Menu : Fullscreen Menu with CSS Grid & TweenMax

    Multibox Menu : Fullscreen Menu with CSS Grid & TweenMax

    Today we’d like to share a simple fullscreen menu with you. The menu layout is powered by CSS Grid and we make its boxes appear with a reveal animation. The animations are made using TweenMax.

    CSS Checkbox Library

    CSS Checkbox Library

    A huge collection of pure css checkboxes.

    Light Modal : Pure CSS based Modal

    Light Modal : Pure CSS based Modal

    Light Modal is a new lightweight, powerful and easy to use CSS modal for content and images.

    Offside.js : JavaScript Off-canvas Push Menu

    Offside.js : JavaScript Off-canvas Push Menu

    Offside.js is a minimal JavaScript kit without library dependencies to push things off-canvas using just class manipulation. It’s goal is to provide a super-lightweight, efficient and customizable way of handling off-canvas menus/elements on modern website and web applications.

    Features:

    • Minimal DOM manipulations
    • No library dependencies
    • Uses CSS3 3D transforms (if you want to)
    • No injected style. Offside entirely relies on classes manipulations
    • BEM-like style
    • Degrades gracefully on browsers not supporting CSS3 3D transforms
    • Handles multiple off-canvas elements
    • Left/right off-canvas

    Diagonal Slideshow with JavaScript & CSS

    Diagonal Slideshow with JavaScript & CSS

    A slideshow with a “diagonal” look and three visible slides. A decorative background element expands to fullscreen when opening the content preview.The animations are powered by TweenMax.

    Splitting : JavaScript microlibrary to Split an element by Words & Characters

    Splitting : JavaScript microlibrary to Split an element by Words & Characters

    Splitting is a JavaScript microlibrary to split an element by words, characters, children and more, populated with CSS variables!

    Most Splitting methods utilize a series of <span>s populated with CSS variables and data attributes unlocking transitions and animations that were previously not feasible with CSS.

    Micron.JS : MicroInteraction library with CSS Animations & JavaScript

    Micron.JS : MicroInteraction library with CSS Animations & JavaScript

    Micron.JS is a micro interaction library which can be used to add Interactions to different DOM Elements. Micron.JS animates an element using CSS power and the interactive behaviours are controlled by JavaScript.

    Micron.JS is easy to adapt and can bring interactions to life using html5 data attributes or a chain of JavaScript methods.

    Slide Out Box Menu with CSS Grid & TweenMax

    Slide Out Box Menu with CSS Grid & TweenMax

    Today we’d like to share a little menu with you. The idea is to reveal the boxes of a grid individually from the top right corner of the page similar to the Expanding Grid Menu we did a while back. The animations are powered by TweenMax.

    Motion Reveal Slideshow with CSS & TweenMax Js

    Motion Reveal Slideshow with CSS & TweenMax Js

    Today we’d like to share another slideshow with you. The idea is to have a bit more of motion when navigating between the slides and showing another preview part with a fullscreen image.The animations are powered by TweenMax.

    Full Image Reveal Effect with TweenMax Animation

    Full Image Reveal Effect with TweenMax Animation

    Today we’d like to share a simple fullscreen image reveal effect with you. The idea is to have an inital thumbnails layout at the bottom of the page and then animate the items when we click them. A covering element comes sliding in and when it moves out, the fullscreen image view is shown behind. We are using TweenMax for the animations.