flight-transition

A Flight component for Codrops page transitions.

Installation

bower install --save flight-transition

Example

HTML

<div id="transition"></div>

<div id="pages" style="diplay: none; visibility: hidden;">
 <div id="defaultPage">
    Hello ...
 </div>
 <div id="anOtherPage">
    ... world.
 </div>
</div>

JS

define(['flight-transition'], function(Transition) {

  // Open a default page without any transition on component initialization
  Transition.attachTo('#transition', {
    defaultInSelector: '#defaultPage'
  });

  // Open a second page using animated transition 
  $(document).trigger('dataTransition', {
    inSelector: '#anOtherPage',
    animation : 'moveFromLeft' 
  });

});

Development

Development of this component requires Bower, and preferably Karma to be globally installed:

npm install -g bower karma

Then install the Node.js and client-side dependencies by running the following commands in the repo's root directory.

npm install
bower install

To continuously run the tests in Chrome and Firefox during development, just run:

karma start

Contributing to this project

Anyone and everyone is welcome to contribute. Please take a moment to review the guidelines for contributing.

• Bug reports
• Feature requests
• Pull requests