react parallax card

React-Parallax-Card

Apple TVアプリのアイコンと同様の3D効果を持つカードの反応コンポーネント。進行中の作業。 https://github.com/drewwilson/atvimgに重く触発されました

デモ

https://theopak.github.io/react-parallax-card

使用法

 # Install from npm
npm install react-parallax-card --save

 import ParallaxCard from 'react-parallax-card'

< ParallaxCard
  label = 'Label (optional)'
  enableRotate
  style = { { margin : '0 auto' , width : 240 , height : 240 } } >
  < img src = 'https://s3-us-west-1.amazonaws.com/tachyonsio/img/Blonde-Frank_Ocean.jpeg' width = '240' role = 'presentation' />
</ ParallaxCard >

代替：CDNからの使用

NPMからインストールする代わりに、HTMLにスクリプトタグを追加して、スタンドアロンビルド（UMDモジュール）を使用できます。ただし、場合は、依存関係を個別に含める必要があります。

 <!-- NOTE: react must be included first -->
< script src =" https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js " > </ script >
< script src =" https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js " > </ script >

<!-- Include react-parallax-card as 'window.ReactParallaxCard' -->
< script src =" https://unpkg.com/react-parallax-card/dist/umd/react-parallax-card.js " > </ script >

ライセンス

Copyright 2017 Theodore X. Pak

Apacheライセンス、バージョン2.0（「ライセンス」）に基づいてライセンスされています。ライセンスに準拠している場合を除き、このファイルを使用することはできません。ライセンスのコピーを取得できます

http://www.apache.org/licenses/license-2.0

適用法で要求されていないか、書面で合意されていない限り、ライセンスに基づいて配布されたソフトウェアは、明示または黙示のいずれかの保証または条件なしに、「現状のまま」に基づいて配布されます。ライセンスに基づく権限と制限を管理する特定の言語のライセンスを参照してください。