universal-parallax
Advanced tools
Comparing version 1.1.1 to 1.1.2
'use strict'; | ||
/** | ||
* @version 1.1.1 | ||
* @version 1.1.2 | ||
* @author Marius Hansen <marius.o.hansen@gmail.com> | ||
@@ -6,0 +6,0 @@ * @license MIT |
{ | ||
"name": "universal-parallax", | ||
"version": "1.1.1", | ||
"description": "Easy parallax plugin using pure javascript. Also works on mobile platforms. Cross browser support.", | ||
"version": "1.1.2", | ||
"description": "Easy parallax plugin using pure javascript. Also works on mobile platforms. Cross browser and opacity support.", | ||
"main": "dist/universal-parallax.js", | ||
@@ -12,2 +12,8 @@ "repository": { | ||
"parallax", | ||
"universal parallax", | ||
"universal", | ||
"background", | ||
"parallax background", | ||
"vanilla parallax", | ||
"javascript parallax", | ||
"javascript", | ||
@@ -18,3 +24,7 @@ "vanilla", | ||
"phone", | ||
"animation" | ||
"mobile phone", | ||
"mobile support", | ||
"opacity", | ||
"transparency", | ||
"transparent" | ||
], | ||
@@ -21,0 +31,0 @@ "author": "Marius Hansen <marius.o.hansen@gmail.com>", |
@@ -0,1 +1,2 @@ | ||
# Universal Parallax | ||
@@ -7,3 +8,3 @@ Easy parallax plugin using pure javascript. Cross browser support, including mobile platforms. | ||
## Features | ||
## :zap: Features | ||
- Easy setup | ||
@@ -15,6 +16,6 @@ - Pure JavaScript plugin - no jQuery needed | ||
## Install | ||
## :floppy_disk: Install | ||
`$ npm i universal-parallax -S` | ||
## Usage | ||
## :rocket: Usage | ||
###### #1 | ||
@@ -36,3 +37,3 @@ Include the script at the bottom of your project | ||
- Or adding this CSS | ||
-- _Gives more flexibility controlling the behaviour of bg images (see "optional" comment)_ | ||
:zap: _Gives more flexibility controlling the behaviour of bg images (see "optional" comment)_ | ||
@@ -64,3 +65,3 @@ ```css | ||
###### #3 | ||
If `<section>` is your container, make the parallax element inside it, just before the **_closing tag_** | ||
If `<section>` is your container, make the parallax element inside it, just before the **_closing tag_** :fire: | ||
@@ -74,3 +75,3 @@ ```html | ||
* You can also use a class to define your `background-image` in CSS, instead of using `data-parallax-image=""` | ||
:zap: You can also use a class to define your `background-image` in CSS, instead of using `data-parallax-image=""` | ||
@@ -85,5 +86,6 @@ ###### #4 | ||
###### #5 | ||
Check the result in your project | ||
- If it resembles [the demo](https://marrio-h.github.io/universal-parallax/demo/) then you're done | ||
- Pls [report any problems](https://github.com/marrio-h/universal-parallax/issues) you find! Thanks :) | ||
That's it! :checkered_flag: | ||
- If it resembles [the demo](https://marrio-h.github.io/universal-parallax/demo/) - you're done :tada: | ||
- See customizations underneath | ||
- Please [report any problems](https://github.com/marrio-h/universal-parallax/issues) you find, or requests for new features and improvements. Thanks! :heart: | ||
@@ -99,12 +101,12 @@ ## Custom speed | ||
**Note:** `speed: 1.2` is the minimum value before the background image is fixed | ||
:zap: `speed: 1.2` is the minimum value before the background image is fixed | ||
## Opacity | ||
If desired, transparency can be added to one, or all parallax elements with CSS and it won't affect the opacity of your content above | ||
If desired, transparency can be added to the parallax elements with CSS and it won't affect the opacity of your content above. _CSS class not included*_ :smirk: | ||
```css | ||
.parallax { | ||
.parallax--opacity { | ||
opacity: 0.5; | ||
} | ||
``` |
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
1802702
106