❤
npm
Sign UpSign In

rotate-icon

1.0.3 • Public • Published

Build Status

Rotate

The simple, easy-to-implement animation plugin to rotate icons, images, and elements.

Getting Started

Download and Setup

To use this plugin, include the jQuery library and the Rotate.js plugin before the closing <body> tag of your HTML document:

<script src="jquery.js"></script>
<script src="rotate.js"></script>

Install with Bower

$ bower install rotate.js

Install with npm

$ npm install rotate-icon

Dependencies

Required:

jQuery (1.2.1 or higher)

Usage

JavaScript

To use the export plugin, just call:

$("#my-selector").rotate();

You can also specify an angle of rotation (in degrees).

$("#my-selector").rotate(720);

Additional properties can be passed in to customize the timing and overall behavior of the animation.

/* Defaults */
$("#my-selector").rotate(360, {         // [Number] animation rotation (degrees)
    duration: 1000,                     // [Number] animation duration
    easing: 'swing',                    // [String] easing function
    complete: function () { }           // [Function] completed callback
});

Settings

Below are the plugin defaults.

/* default animation rotation (degrees) */
 $.fn.rotate.degrees = 360;
 
/* default duration, easing, and completed callback  */
    $.fn.rotate.defaults = {
        duration: 1000,
        easing: 'swing',
        complete: function () {
        }
    };

Browser Support

Chrome Firefox IE Opera Safari
Android ✓ ✓ ✓ ✓ ✓
iOS ✓ ✓ ✓ ✓ ✓
Mac OSX ✓ ✓ ✓ ✓ ✓
Windows ✓ ✓ ✓ ✓ ✓

Live Demo

A live, interactive demo can be found here:

www.travismclarke.com

License

Rotate.js is licensed under the terms of the MIT License

Credits

Readme

Keywords

Package Sidebar

Install

npm i rotate-icon

Repository

github.com/clarketm/Rotate

Homepage

www.travismclarke.com

Weekly Downloads

41

Version

1.0.3

License

MIT

Last publish

Collaborators

  • clarketm
Try on RunKit
Report malware