🚀 Big News: Socket Acquires Coana to Bring Reachability Analysis to Every Appsec Team.Learn more →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

react-parallax

Package Overview
Dependencies
Maintainers
1
Versions
70
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

react-parallax - npm Package Compare versions

Comparing version

0.0.2
to
0.0.3

7

dist/Parallax.js

@@ -186,8 +186,3 @@ "use strict";

return {
position: "absolute",
top: "50%",
left: "50%",
WebkitTransform: "translate(-50%, -50%)",
msTransform: "translate(-50%, -50%)",
transform: "translate(-50%, -50%)"
position: "relative"
};

@@ -194,0 +189,0 @@ }

2

package.json
{
"name": "react-parallax",
"author": "Richard Rutsche",
"version": "0.0.2",
"version": "0.0.3",
"description": "A React Component for parallax effect.",

@@ -6,0 +6,0 @@ "repository": {

7

src/jsx/Parallax.jsx

@@ -144,8 +144,3 @@ import React from 'react';

return {
position: 'absolute',
top: '50%',
left: '50%',
WebkitTransform: 'translate(-50%, -50%)',
msTransform: 'translate(-50%, -50%)',
transform: 'translate(-50%, -50%)'
position: 'relative'
};

@@ -152,0 +147,0 @@ }

35

src/KitchenSink.jsx

@@ -16,3 +16,4 @@ import React from 'react';

backgroundColor: '#efefef',
color: 'white'
color: 'white',
textAlign: 'center'
};

@@ -27,5 +28,5 @@ let fontStyle = {

<div style={style}>
<Parallax bgColor="white" bgImage="assets/1.jpg" strength={300} log={true}>
<Parallax bgColor="white" bgImage="assets/1.jpg" strength={400} log={true}>
<br/><br/><br/><br/>
<h1>first parallax</h1>
<h1 style={fontStyle}>first parallax</h1>
<br/>

@@ -37,3 +38,3 @@ <br/>

<br/>
<h2>filled with murray</h2>
<h2 style={fontStyle}>filled with murray</h2>
<br/>

@@ -43,15 +44,15 @@ </Parallax>

<br/><br/><br/><br/>
<h1>none-parallax content</h1>
<h1 style={fontStyle}>none-parallax content</h1>
<br/>
<h2>-------------</h2>
<h2>because we can</h2>
<h2 style={fontStyle}>-------------</h2>
<h2 style={fontStyle}>because we can</h2>
<br/><br/><br/><br/>
</div>
<Parallax bgImage="assets/2.jpg" blur={3}>
<Parallax bgImage="assets/2.jpg" strength={300} blur={3}>
<br/><br/><br/><br/>
<h1>its the third</h1>
<h2>text just has to fill the container to make the image visible</h2>
<h1 style={fontStyle}>its the third</h1>
<h2 style={fontStyle}>text just has to fill the container to make the image visible</h2>
<br/>
<br/>
<h2>it's just there</h2>
<h2 style={fontStyle}>it's just there</h2>
<br/><br/><br/><br/>

@@ -62,13 +63,13 @@

<br/><br/><br/><br/>
<h1>guess</h1>
<h1>what?</h1>
<h1 style={fontStyle}>guess</h1>
<h1 style={fontStyle}>what?</h1>
<br/><br/><br/><br/>
</Parallax>
<Parallax bgImage="assets/3.jpg">
<Parallax bgImage="assets/3.jpg" strength={300}>
<br/><br/><br/><br/>
<h1>last one...</h1>
<h2>one more placeholder</h2>
<h1 style={fontStyle}>last one...</h1>
<h2 style={fontStyle}>one more placeholder</h2>
<br/>
<br/>
<h2>empty</h2>
<h2 style={fontStyle}>empty</h2>
<br/><br/><br/><br/>

@@ -75,0 +76,0 @@