Pendulum-effect-using-jquery-css

why to write a long and long css scripts, which give results as slow response and eat all up of your server space. This is an API that is created and Maintain by GrapDevs, a small and beautifull api that create a "CSS script" using javascript and jquery at user side, as creating css at user side makes your website fast to load as you not transferring a large css file from server to user side.

DEMO LINK 1 [Redirects to Home server]

http://demo1.grapdevs.tech:8080/pendu-demo/

if link 1 is not working

DEMO LINK 2

http://demo.grapdevs.tech/pendu-demo/

How this work.
This script automatically creates a buch of css lines with tansform property [ 0% { transform: translate(0px, 0px) rotate(0deg); } to 100% { transform: translate(0px, 0px) rotate(0deg); } ] as using this API you don't have to write every single percentage and degree from [0 to 100 & 100 to 0 ] to create pendulum effect.

How to Implement : 1.Add jquery API [GOOGLE CDN or etc ]at the top of page [as shown in example] GOOGLE CDN - https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"

2.Add Grapdevs API at the very bottom of page or after the closing of body tag GrapDevs javascript API - " Download /grap-javascript-api.js and host by your own. Script available in js folder"
or
https://raw.githubusercontent.com/grapdevs/Pendulum-effect-using-jquery-css/master/js/grap-javascript-api.js - "NOT RECOMENDED"

3.Add class -> [ grap-pendu-l ] on the tag where you want to give a pendulum effect,

Example -> <img class="grap-pendu-l" height="350px;"src="blahblah.jpg">

AND THAT"S ALL ;-)

For queries- mail me at (dev@grapdevs.tech)

Follow me on IG for more updates (@grapdevs)