https://github.com/tmeasday/iron-transitioner

https://github.com/tmeasday/iron-transitioner

Last synced: 2 months ago
JSON representation

• Host: GitHub
• URL: https://github.com/tmeasday/iron-transitioner
• Owner: tmeasday
• Created: 2013-07-08T03:53:56.000Z (over 11 years ago)
• Default Branch: master
• Last Pushed: 2014-05-28T08:06:10.000Z (over 10 years ago)
• Last Synced: 2024-10-03T12:37:51.383Z (3 months ago)
• Language: JavaScript
• Size: 227 KB
• Stars: 36
• Watchers: 5
• Forks: 7
• Open Issues: 7
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
**NOTE**: to use IT with 0.8.0, try the blaze branch of percolatestudio/iron-transitioner. YMMV

To use, simply place 

```

  {{> transitionerPanes}}

```

in your _master_ layout.

Notes:

1. Each page will be rendered within it's own layout.

2. The transitioner will skip between the left and right panes.

3. Here's some minimal CSS to get it going (you'll probably want significantly more than this):

```css

.transitioner-panes, .current-page, .next-page {

  position: absolute;

  top: 0;

  left: 0;

  right: 0;

  bottom: 0;

  

  -webkit-transform: translate3d(0, 0, 0);

  -webkit-transition: all 500ms ease-in;

}

.next-page {

  -webkit-transform: translate3d(100%, 0, 0);

}

.transitioner-panes.transitioning {

  -webkit-transform: translate3d(-100%, 0, 0);

}

```