Nine front-end magic libraries, make your front-end projects beautify instantly, and Party A will cry when they see it

Nine front-end magic libraries

Article directory

Nine front-end magic libraries, make your front-end projects beautify instantly, and Party A will cry when they see it
1. Lottie-web/Bodymovin
2. Parallax.js
3. Magic Grid
4. webslides
5. SVG.js
6. rellax
7. dynamics.js
8.mo.js
9. zdog

1. Lottie-web/Bodymovin

Library address: https://github.com/airbnb/lottie-web

With this library, it is possible to export directly to your URL from the animation of a scene in Adode After Effects
insert image description here

2. Parallax.js

Library address: https://github.com/wagerfield/parallax

This library can create a beautiful parallax effect, controlled with mouse movement, and also adjust the speed of moving objects
insert image description here

3. Magic Grid

Library address: https://github.com/e-oj/Magic-Grid

This library helps us create an adaptive grid where you don't need to create a separate @media style just specify the container
insert image description here

4. webslides

Library address: https://github.com/webslides/webslides

webslides is an open source HTML slideshow project that can help developers familiar with front-end languages to quickly create beautiful slideshows
. Each <section> in the page is an independent slideshow, requiring only a few css code decorations Just
insert image description here

5. SVG.js

Library address: https://github.com/svgdotjs/svg.js

SVG.js is a lightweight JavaScript library that allows you to easily manipulate SVGs and define animations
insert image description here

6. rellax

Library address: https://github.com/dixonandmoe/relax

rellax.js is a lightweight pure JavaScript scrolling parallax effect plug-in. The compressed version of rellax.js is only 871 bytes.
In mobile phones with small screen devices, the plug-in will automatically limit the visual characteristics
insert image description here

7. dynamics.js

Library address: https://github.com/michaelvillar/dynamics.js

dynamics.js is a JavaScript library that creates physics-based CSS animations
insert image description here

8.mo.js

Library address: https://github.com/mojs//mojs

mo.js is a concise, efficient graphics animation library with smooth animations and amazing user experience
insert image description here

9. zdog

Library address: https://github.com/metafizzy/zdog

zdog is a round, flat, designer friendly pseudo 3D engine, through this library, it is possible to create pseudo 3D elements

insert image description here

Source: Station B@小 Taobu Amoy
Video address: Video address explanation