February 16, 2016 7:18 am

5 Free fancy light weight jQuery plugins to add 3d effects to your website

Hello Friends in today’s tutorial I will give you some really amazing list of jQuery plugins to add 3d effects to your website, I hope you will like this tutorial and implement it in your websites.

Makisu

makisu_css_3d_dropdown

Simply, It’s a nice CSS 3D dropdown concept, wrapped up in a jQuery plugin. You can adjuct the wrapping speed, 3d perspective and shading which makes it perfect for any fancy design that you may have.

Link to official website and demo: http://soulwire.github.io/Makisu/

Github link:  https://github.com/soulwire/Makisu

List of supported browser: http://caniuse.com/#search=3d%20transform

Flipster

flipster

Flipster is a CSS3 3D transform-based jQuery plugin. The creators describe it as built to replicate the familiar ‘cover flow’ effect. It’s responsive, supports touch, wheel, trackpad and keyboard and has different styles.

It supports Chrome, Safari & iOS Safari, Firefox, IE 10+ and limited support for IE 8-9.

Link to official website and demo: http://brokensquare.com/Code/jquery-flipster/demo/

Github link:  https://github.com/drien/jquery-flipster

3D curtain

curtains

It’s a simple 3D curtain style animation. It’s developed using Animate.CSS and jQuery, And with support for mousewheel with debounce.

Link to official website and demo: https://hasinhayder.github.io/css3-3d-curtain/

Github link:  https://github.com/hasinhayder/css3-3d-curtain

Reveal.js

reveal

It’s an advanced yet simple framework which can be used for easily creating beautiful presentations using HTML.

reveal.js is loaded with with a wide range of features including nested slides, Markdown contents, PDF export, speaker notes and a JavaScript API. It’s supports all the modern browsers.

Link to official website and demo: http://lab.hakim.se/reveal-js/#/

Github link: https://github.com/hakimel/reveal.js

Slicebox

slicebox

Slicebox is a beautiful jQuery image slider plugin that is based on CSS 3D Transforms and comes with a graceful fallback for older browsers that don’t support the new properties, And of course it supports all the modern browsers.

Link to official website and demo: http://tympanus.net/Development/Slicebox/

Tutorial Categories:

Author Amr Abdou

A full-stack web developer, Linux enthusiast, freelance tech writer & open-source supporter. Loves finding quit corners in public places or cafes accompanied by his laptop to try changing the world from there. You can check his latest works at social-evolvea.com or follow him on facebook, twitter, Linkedin or Google+


Tutorial Categories: