Web Development

10 Awesome Javascript Plugins with Cool Animation

Written by Kevin Liew on 18 Mar 2015
43,186 Views • Shares
0 comments

Web development is pretty fun. I like it because it has so much to learn and so many solutions to solve a problem. It forces me to think creatively and think beyond the box. And one of the best thing - there are thousands of free solutions such as Javascript plugins out there available as open source, that means we can use it free of charge.

There are a few advantages of using already made Javascript plugins:

  • If you choose carefully, there are many plugins are well-tested and cross platform.
  • It saves time, you don't have to reinvent the wheel.
  • Most of the reputable plugin has a good documentation. It has options, methods and callback events for easy customization.

Nowadays, subtle animation is quite a popular goodies you'd see in websites. If it's implemented properly, it can make a website looks great and leave good impression as well. Want some of those but don't have time to implement? Here we have a list of cool Javascript plugins that can help you to achieve it without taking much of your times.

 

animatedModal.js

animatedModal.js is a jQuery plugin to create a fullscreen modal with CSS3 transitions. You can use the transitions from animate.css or create your own transitions.

It's a full screen window modal that cut off all the distraction and let you focus just the modal content.

 

DateDropper

DateDropper is a jQuery plugin that provides a quick and easy way to manage dates for input fields

This is one of the best datepickers with slick animation and UI.

 

Slideout.js

A touch slideout navigation menu for your mobile web apps.

Slideout menu is a very popular menu solution for mobile devices. Here we have a well-implemented and well-tested slide out menu for quick implementation and save heaps of times.

 

AlertifyJS

AlertifyJS is a javascript framework for developing pretty browser dialogs and notifications.

This has been my favourite to replace browser's native alert and dialogue box. It's easy to style too.

 

WheelNavJS

As its name implied, it's a menu in wheel shape. It's a very rare and unique implementation of menu. I haven't find a place for it yet, but it does look fancy when spinning to other menu item.

 

Elastic SVG Element

From the popular Codrops tutorial. Here is the implementation of elastic menu by using SVG.

 

PhotoSwipe

An iOS inspired standalone Javascript photo gallery with all the subtle animation effects. It support touch gestures just like how you pinch and spread on iOS devices.

 

Face Detection

A jQuery/Zepto Face Detection plugin that works on images and videos.

It's actually quite impressive. The author is using face detection algorithm from Liu Liu.

 

Walkway.js

An easy way to animate SVG images consisting of line, path, and polyline elements.

Last but not least

No matter if you want to build a website with blog or the best online casino games, you gotta use some of this plugins. It will instantly save heaps of times so you can focus on different areas that require more attention.

Join the discussion

Comments will be moderated and rel="nofollow" will be added to all links. You can wrap your coding with [code][/code] to make use of built-in syntax highlighter.