Get new jQuery plugins just once a week

×

animsition

FavoriteLoadingAdd to favorites

October 27, 2014

css animated page transitions

Animsition is a simple and easy jQuery plugin for css animated page transitions on load.

$(document).ready(function() {

$(".css-class").animsition({

inClass : 'fade-in',
outClass : 'fade-out',
inDuration : 1500,
outDuration : 800,
linkElement : '.animsition-link',
// e.g. linkElement : 'a:not([target="_blank"]):not([href^=#])'
loading : true,
loadingParentElement : 'body', //animsition wrapper element
loadingClass : 'animsition-loading',
unSupportCss : [ 'animation-duration',
'-webkit-animation-duration',
'-o-animation-duration'
],
//"unSupportCss" option allows you to disable the "animsition" in case the css property in the array is not supported by your browser.
//The default setting is to disable the "animsition" in a browser that does not support "animation-duration".

overlay : false,

overlayClass : 'animsition-overlay-slide',
overlayParentElement : 'body'
});
});

Created by Yasuyuki Enomoto

Download

Example

Animsition jQuery plugin

css animation

Animsition

Bower version npm version Build Status

A simple and easy jQuery plugin for CSS animated page transitions.

Demo & Installation

http://git.blivesta.com/animsition/

Development

Install : nodejs npm gulp

$ git clone https://github.com/blivesta/animsition.git
$ cd animsition
$ git checkout -b patch-1
$ npm install && gulp

Build

$ gulp build

Build -> Watch

$ gulp

CDN

cdnjs

Contributing

To contribute to animsition, clone this repo locally and commit your code.
Please check that everything works before opening a pull-request.

Contributors

License

Released under the MIT license.


Wordpress plugin

Page Transition

animsition

Related posts:

Reveal-js
jWorld
Rainbow-js

To install using Bower
bower install animsition

Animsition jQuery plugin

http://jquer.in/wp-content/uploads/2014/08/Animsition.jpg

jQuery plugin

Sign up for our weekly newsletter.

* We won't spam you ever