6 New CSS Libraries

Simple Bar

 

SimpleBar does only one thing: replace the browser's default scrollbars with a custom CSS-styled scrollbar without losing performance. Unlike some popular plugins, SimpleBar doesn't mimic scroll with Javascript, causing janks and strange scrolling behaviours. You keep the awesomeness of native scrolling - with a custom scrollbar.

SimpleBar uses pure CSS to style the scrollbar. You can easily customize it as you want. Or even have multiple style on the same page - or just keep the default style. Lightweight and performant. Only 5kb minified. SimpleBar doesn't use Javascript to handle scrolling. You keep the performances/behaviours of the native scroll.Supported everywhere. SimpleBar supports every modern browser and IE9+. It disables itself on mobile and device with "floating" scrollbars (macbook trackpad for example). But it can still be enabled if you want it.

Repaintless.css

Repaintless.css in a lightweight animation library that consists only of animations that don't cause reflows and repaints of a website when used correctly. The idea for a library came after seeing the talk by Paul Lewis on animations and FLIP technique. Basic idea is to remove transition from element, not to apply it while animating. It saves user a tiny lag before animation starts and feels super smooth.

You can download it from Github - there you can find istructions on how to install and use it.

Splitting.js

Library for animating text and grids with CSS variables. Splitting creates elements and adds CSS variables to unlock amazing possibilities for animating text, grids, and more. The previously impractical becomes easy with Splitting's CSS Variables. A shocking amount of features in a 1.5kb (minified & gzipped) package. Upgrade websites for modern browsers without breaking IE.

Boilerform

Boilerform is a little HTML and CSS boilerplate to take the pain away from working with forms. By providing baseline BEM structured CSS and appropriate attributes on elements: Boilerform gives you a head start building forms in the best possible way with a view to being dropped into most projects. Download it from Boilerform - you can find there exact instructions on how to set it up.

AnimTrap

AnimTrap is a CSS Framework for animations. Its like bootstrap for JS animations. All you need is to import AnimTrap and use it for animations in your webapp easily. AnimTrap supports animations like scrolling and simple effects which would make a richer experience from your webapp. Download it from Github together with instructions.

Motus

An animation library that mimics CSS keyframes when scrolling. Motus allows developers to create beatuful animations that simulate css keyframes and are applied when the user scrolls.

• Node & Browser Support
• Simple and intuitive api
• Scroll hooks
• Both vertical and horizontal scrolling
  
  
  
  

You can dowload it Here !