react parallax card

反應 - 帕拉克斯卡

與Apple TV應用程序圖標類似的3D效果的卡片的React組件。正在進行中。受https://github.com/drewwilson/atvimg的啟發

演示

https://theopak.github.io/reeact-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的用法

您可以通過將腳本標籤添加到HTML來使用獨立構建（UMD模塊），而不是從NPM安裝。但是，如果這樣做，您還需要單獨包括依賴項。

 <!-- 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 >

執照

版權2017 Theodore X. Pak

根據Apache許可證（版本2.0（“許可”）獲得許可；除了符合許可外，您不得使用此文件。您可以在

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

除非適用法律要求或以書面形式同意，否則根據許可證分配的軟件是按照“原樣”分發的，沒有任何明示或暗示的任何形式的保證或條件。請參閱許可證，以獲取執行許可條款和限制的特定語言。